-
margin padding 四个方向的百分比宽度参照的都是父元素的宽度
-
CSS 的权重和优先级
- !important:无穷大 行内：1000； id：100； class、属性、伪类：10 ； 标签、伪元素：1； 通配符*：0
- 相同权重的后面会覆盖前面的
-
CSS 怎么画一个大小为父元素宽度一半的正方形？
- with百分比宽度也是相对父元素宽度
- height高度是相对父元素的高度
-
实现两栏布局的方式：
- 左 float，然后右 margin-left（右边自适应）
- 右 float，margin-right
- BFC + float
- BFC后 内容就不会被遮挡了
- float + 负 margin
- 圣杯布局实现两栏布局
- flex 实现两栏布局
- position + margin
-
实现三列布局的方式
- position + margin-left + margin-right
- 通过 float + margin
- 左右元素先float，中间元素预留出左右的margin区域
- 圣杯布局
- 都float
- 中间元素在最前面，宽度100%
- 左右也float，margin负值跟自己宽度相同
- 双飞翼布局
- 都是float布局
- 左元素margin-left:-100%;
- 这100%是相对父元素的宽度
- 右元素margin-left:-300;自己的宽度。
- flex 布局
-
CSS 动画有哪些？
- animation：用于设置动画属性，他是一个简写的属性，包含6个属性
- transition：用于设置元素的样式过度，和animation有着类似的效果，但细节上有很大的不同
- transform：用于元素进行旋转、缩放、移动或倾斜，和设置样式的动画并没有什么关系
- translate：translate只是transform的一个属性值，即移动，除此之外还有 scale 等
-
什么是 BFC
-
BFC（Block Formatting Context）格式化上下文，指一个独立的渲染区域或者说是一个隔离的独立容器。
-
形成 BFC 的条件
-
浮动元素，float 除 none 以外的值
-
定位元素，position（absolute，fixed）
-
overflow 除了 visible 以外的值（hidden，auto，scroll）
-
display 为以下其中之一的值 inline-block，table-cell，table-caption
-
HTML 就是一个 BFC
-
-
BFC 的特性：
- 内部的 Box 会在垂直方向上一个接一个的放置
- 垂直方向上的距离由 margin 决定
- bfc 的区域不会与 float 的元素区域重叠。
- 计算 bfc 的高度时，浮动元素也参与计算
- bfc 就是页面上的一个独立容器，容器里面的子元素不会影响外面元素。
-
-
清除浮动有哪些方法？
- clear清除浮动（添加空div法）在浮动元素下方添加空div,并给该元素写css样式：{clear:both;height:0;overflow:hidden;}
- 给父级添加overflow:hidden 清除浮动方法
- 万能清除法 after伪类 清浮动（现在主流方法，推荐使用）
