-
CSS中的单位
CSS中单位的形式有很多种，如常用的可能就是px(像素)相对单位相对单位是相对于另一个长度的长度，需要通过计算才能得出字体相对单位是根据font-size来计算的。常见的字体相对单位有：em、rem、ex、chem和rem：相对于font-size属性值来计算em是相对于自身font-size属性，当自身没有font-size时会向上查找父元素直到找到font-size属性，如果所有父元素都没有设置，会使用浏览器的默认字体尺寸rem相对于em就简单了很多，它是根据页面的根元素(html元素)的font-size属性来计算的，没有设定该属性则使用浏览器的默认字体尺寸ex 和 ch：是排版用...
2023-01-11 -
CSS中的滤镜和尺寸冲突
CSS中的滤镜CSS中的滤镜使用filter属性实现none：默认值，没有效果blur(px)：高斯模糊。设定高斯函数的标准差，或屏幕上以多少像素融在一起，值越大越模糊，默认0；brightness(%)：线性乘法，使其看起来更亮或更暗值是0%，图像会全黑 值是100%，则图像无变化 可以超过100%，意味着会运用更低的对比 默认100% drop-shadow(h-shadow v-shadow blur color)：设置阴影与已有的box-shadow属性很相似，但通过filter，一些浏览器为了更好的性能会提供硬件加速 offset-x：阴影水平偏移量，可为负数 offset-y...
2022-11-21 -
jsvascript中的生成器函数
function*声明方式(function关键字后跟一个星号)会定义一个生成器函数(generator function)生成器函数在执行时能暂停，后面又能从暂停处继续执行调用一个生成器函数并不会执行它里面的语句，而是返回一个这个生成器的迭代器(iterator)对象当这个迭代器的next()方法被调用时，其内的语句会执行到下一个yield位置为止，yield后紧跟迭代器要返回的值next()方法返回一个对象，这个对象包含两个属性：value 和 done，value属性表示本次yield语句后面的值，done 属性为布尔类型，表示生成器后续是否还有 yield 语句，即生成器函数是否...
2022-11-20 -
HTML5中的IntersectionObserver接口
HTML5中的IntersectionObserver接口在前端开发中，有个很重要的概念，叫做懒加载，如监听当页面滚动到底部时加载更多，这个时候，我们通常是使用监听scroll或者使用setInterval来判断，监听底部的元素是否进入视图，其中scroll由于其特别大的计算量，会有性能问题，而setInterval由于其有间歇期，也会出现体验问题html5中提供了一个IntersectionObserver接口，该接口提供了一种异步观察目标元素与根(root)交叉状态的方法使用new关键字声明一个新的观察者对象observerconst observer = new Intersect...
2022-11-20 -
CSS中的BFC
BFC(Block Formatting Context)就是块级格式化上下文一个BFC区域包含创建该上下文元素的所有子元素，但是不包括创建了新的BFC的子元素的内部元素BFC是一块块独立的渲染区域，可以将BFC看成是元素的一种属性，拥有了这种属性的元素就会使他的子元素与世隔绝，不会影响到外部其他元素<div class="box1"> <div class="box2"></div> <div class="box3"></div> <d...
2022-11-19