css注意

伪类

伪类：visited仅适用于超链接，不能应用在其他元素上。

伪类：nth-child(odd)用于选择同一父元素中的奇数元素。

伪类：nth-child(1)等同于frist-child用于选择同一父元素中的第一个元素。

父元素高度塌陷问题

方法1.

给父元素添加overflower：hieder 缺点：当子元素有定位设置，定位到父元素外面，不希望溢出部分溢出隐藏时就不行了 方法2.

在最后浮动的元素下方添加空div，并给该元素添加声明： clear：both，height：0，overflow：hidder 缺点：在HTML结构文档中会形成很多冗余代码 方法3.

在父元素选择器上进行设置：

div:after{content：",”;clear:both;display:block;height:0;overflow:hidden;visibility:hidden}

注：最好在父元素中设置好宽高，以免出现高度塌陷的问题

元素阴影（box-shadow）

1.前两个值是必选项，分别表示阴影的水平偏移量和垂直偏移量。

2.第三个值不是必选项，表示元素阴影的模糊距离。

3.第四个值不是必选项，表示元素阴影的阴影距离。

4.当取值中出现inset时表示元素内部阴影。

弹性项目

flex-shrink:0;可以使弹性项目不受空间不足时的影响。

伪类与伪元素的区别

1.CSS3为了区分，明确规定伪类使用一个冒号表示，伪元素使用两个冒号表示。

2.伪类可用于向某些选择器在某种状态下添加特殊效果。

3.伪元素用于将特殊的效果添加到某些选择器。

4.伪元素可以比作一个假元素，但存在与dom树中，通常用来向元素添加小图标、清除浮动影响等。

绝对定位默认定位在浏览器窗口。

CSS样式表不能用来制作体积更小下载更快的网页。 错误

CSS优化

1.尽量避免在HTML标签中写style属性。

2.不滥用float，float在渲染时计算量较大，尽量减少使用。

3.不声明过多的font-size，可能会引发CSS树的效率。

值为0时不需要任何单位，为了浏览器兼容性和性能，值为0时不带单位。

块元素

块元素宽度计算公式：width+padding+border

常用可继承的属性

font-size、color、font-family、text-align

其他

justity-countent：在弹性容器中设置弹性项目在主轴上的排列方式。

align-content：在弹性容器中设置弹性项目在交叉轴上的排列方式。

animation-name：在需要播放动画的元素样式中来引用已经定义的动画。

position:sticky：表示元素采用黏性定位。

transition：属性用来设置CSS的过渡效果。

overflow:visable：不会形成BFC。（当overflow不为visible时会形成BFC）

order：在弹性容器中设置弹性项目在弹性容器中的视觉顺序。

flex-direction:row：主轴的方向是水平且从左到右。

FontAwesome中图标相应的class名称前缀为：fa。