宽度自适应
width（宽度自适应应用于块级元素）
在网页布局中，给块级元素设置宽度为100%的时候，会自适应到浏览器全屏宽度（通栏效果）
块级元素不设置宽度的情况下，默认宽度为100%
块级不去设置宽度的时候，会和父级等宽
重要：如果当前元素脱离了文档流，元素的宽高大小由自身的内容决定
用到了定位（固定和绝对定位）或者浮动属性一定要给元素添加宽高大小
高度自适应 height
如果不设置容器高度，那么容器就不会显示在浏览器上
如果容器没有设置高度或者设置成auto的时候，高度会根据内容撑开，做到高度自适应
重点：子级元素自适应父级元素的高度
自适应浏览器高度：浏览器宽度默认为100%，高度默认为0 html，body{height：100%}
图片自适应到父级容器：img{width：100%；height：100%} 图片会被拉伸变形
重要的属性：**最小高度 min-height 网站的留言模块
作用：
当盒子没有内容的时候保持一个固定高度（height）
当盒子由内容的时候会根据内容的多少自动撑开盒子的高度（height：auto）
越好用的属性问题越多（兼容问题）
最小高度的兼容问题：只能在高版本浏览器中使用，低版本浏览器不兼容
下划线过滤器 写法：_属性：属性值 表示当前这个属性只能在低版本中使用
！important 最高权重
内联/行内样式表>id>class>标签
写法：属性：属性值 ！important
高度塌陷/高度坍塌
造成高度塌陷的原因：父级没有设置高度，子级元素含有浮动属性
父级没有设置高度的原因：父级容器做到自适应
子级元素含有浮动属性：布局需求 脱离文档流 初始位置不存在 父级高度就不会被子级撑开
1.给父级添加高度 height：固定值
优点：从根本上解决了高度塌陷
缺点：不能做到自适应
2.给父级添加overflow：hidden
原理：使用了文本溢出属性，可以触发BFC（块级格式化上下文）在BFC中有一条布局规则（浮动元素也参与高度计算）
优点：好理解 ，可以解决高度坍塌
缺点：如果子级元素有超出父级区域的部分，会被隐藏起来
3.在当前最后一个子级元素后面添加一个任意标签，给这个标签设置clear：both属性
属性的解释：clear清除 left right both
优点：需要解决高度塌陷的时候，写标签和类名就可以
缺点：代码冗余，造成不必要的错误结构
4.万能清除法（只要求会用，不要理解）
用法：在父级上添加一个类名 clear-fix
再给这个类名添加声明
clear-fix：：after{
content：‘’；
width：100%；
height：0；
display：block；
overflow：hidden；
clear：both；
visibility: hidden;
}
伪对象/伪元素
1.选择器：after{content：''} 表示在xx之后，必须要和content一起使用
2.选择器：before{content：''}表示在xx之前
3.first-letter 定义第一个文本样式
4.first-line 定义第一行文本样式
隐藏元素的方法
display：none 删除结构
visibility：hidden 删除了在页面中的显示文本 结构还是存在的
overflow：hidden 超出才可以隐藏元素
opacity：0（0~1） 背景颜色
面试题：伪类和伪对象（伪元素）的区别是什么？
伪类选择器：hover ，：link，：visited， ：active
伪对象/伪元素选择器 ：：before， ：：after， ：：first-letter， ：：first-line
总结：两者的区别
1.写法上的区别
伪类：只有一个冒号
伪对象：两个冒号 在css2中两者都是一个冒号，后来为了区分伪类和伪对象的区别，在css3中规定了伪对象书写的时候要用两个冒号
2.功能作用
伪类：只能通过伪类改变元素的样式
伪对象：伪对象可以新增html结构（dom元素）dom元素是虚拟的
