2020-11-03

伪元素清除浮动

1额外标签法称为隔墙法 是W3C推荐的做法

.clearfix::after{

content：“”

display:block;

height:0;

clear:both;

visibility:hidden;

}

双隔墙清除

,clearfix::before,clearfix:after{

content：“”；

display：table；

}

.clearfix::after{

clear:both；

}

css盒子模型

CSS3中可以通过box-sizing来指定盒模型，有两个值即可以指定为content-box，border-box ，这样我们计算盒子大小的方式就发生了改变

可以分为两种情况

1 box-sizing:content-box 盒子大小为width+padding+border（以前默认的）

2box-sizing:border-box 盒子大小为width    重点使用 

图片模糊处理

filter：blur（）

blur是一个函数，数值越大 图片越模糊

calc函数

cals（）计算盒子宽度 自适应

 

css3过渡 重点

transition 要过渡的属性 花费时间 运动曲线 何时开始

1属性 ：想要变化的CSS属性 宽度高度 背景颜色 内外边距都可以  如果想要所有的属性的都变化过渡 写一个all就可以

2花费时间： 单位是秒（必须写单位的） 比如0.5S

3运动曲线：默认是ease （可以省略）

4何时开始: 单位是秒（必须写单位）可以设置延迟触发时间 默认是0S （可以被省略）