宽高自适应

1、自适应

（1）宽度自适应    元素宽度设置为100%。（块元素宽度默认为100%）元素脱离文档流（浮动或绝对定位）可使元素自适应内容宽度

（2）高度自适应    元素的高度自适应： 设置如： div {height : auto;}  

2、属性

min-height（最小高度）

max-height(最大高度)

min-width(最小宽度)

max-width(最大宽度)

3、过滤器

1）_ ：下划线属性过滤器 

 当在一个属性前面增加了一个下划线后，由于符合标准的浏览器不能识别带有下划线的属性而忽略了这个声明，但是在IE6及更低版本浏览器中会继续解析这个规则。

语法：选择符{  _属性：属性值；} 此方法是区分IE6浏览器和其他浏览器的方法；

2）!important：最高权重关键字过滤器

它表示所附加的声明具有最高优先级的意思。被浏览器优先显示。（IE6不识别此写法）

语法：选择符{属性：属性值!important;}

4、高度塌陷

最好的解决办法：万能清除法

给父级增加如下代码：

.clear-fix::after{

content:'';

width:100%'

height:0;

display:block;

overflow:hidden;

clear:both;

visibility:hidden

5、伪对象选择器

1）：：after：表示在文本后面添加，跟content配合使用

2）：：before：表示在文本前面添加，跟content配合使用

3）：：first-letter：选择第一个文本

4）：：first-line：选择第一行

与伪类的区别：伪类一个冒号，只设样式；伪对象两冒号，设样式还可以设虚拟结构