CSS快速入门基础知识（七）

1.自适应

宽度自适应： width: 100%; 块级元素：宽度默认100% 。

min-width: 最小宽度 max-width 最大宽度

高度自适应： 1. height: auto ; 2. height不写

height:100% ; 继承父元素的高度。（注意，父元素必须要有高度，如果没有，由内容撑开。） min-height: 最小高度 max-height: 最大高度

2.高度塌陷

高度塌陷的原因： 父元素没有添加高度或者height 为 auto，子元素添加浮动， 则会出现高度塌陷

解决方法(清除浮动)： 1.在浮动元素的下方添加空的div(块级元素),且设置clear: both ，不推荐 2.直接给父元素添加height 不推荐 3.给父元素 添加 overflow:hidden; 慎用 。 4.万能清除法 ：常用 clear_fix（写在父元素类名后，）

.clear_fix::after{ content:" "; display:block; height:0; visibility:hidden; overflow:hidden; clear:both; }

3.元素隐藏

visibility:hidden; 属性会使对象不可见，但该对像在网页所占的空间没有改变， 等于留出了一块空白区域， display:none; 属性会使这个对象彻底消失不显示，也不再占用位置。

4.伪元素

伪元素:: h5伪元素可以写一个冒号 权重0001 伪类 0010

::after 在...之后添加内容 ::before 在...之前添加内容 注意: :after和:before使用时必须具有content属性 :first- letter 定义对象内第一个字符的样式，注:该伪元素 只能用于块元素 :first- line 定义 对象内第一行的样式，注:该伪元素只能用于块元素 注意: :first- letter和:first- line该伪元素只能用于块元素