一、css属性
1、层叠性
css样式的叠加
2、继承性
子元素会继承父元素的某些样式
除了边框属性、外边距属性、内边距属性、背景属性，定位属性、布局属性、元素高度属性不会被继承外，其他默认属性都会继承。
div继承的是父元素body的高度，body是继承html的高度，html是继承的浏览器屏幕的高度。
3、优先级
就近原则，行内样式优先
选择器优先级：id选择器>类选择器>标记选择器
css定义了一个!important命令，该命令增大优先级
二、块级格式上下文 BFC
css定位方式有普通流、浮动和绝对定位。
BFC属于普通流，是元素的一种属性，拥有BFC的元素，相当于一块独立的渲染区域。
触发BFC:
1、根元素（<html>）
2、浮动元素（元素的float不是none）
3、绝对定位元素（元素的position为absolute或fixed）
4、display为inline-block、table-cell、table-caption、table、table-row、table-row-group、table-header-group、table-footer-group、inline-table、flow-root、flex、或inline-flex、grid、inline-grid
5、overflow值不为visible的块元素
6、contain值为layout、content或paint的元素
7、多列容器（元素的column-count或column-width不为auto，包括column-count为1）
BFC可以：
1、避免外边距重叠，一般情况下两个相邻div外边距会发生重叠现象，取最大的那个。为了避免这种情况的发生,可以将两个div放置于不同的BFC中，两个BFC的内容将不会互相干扰。
2、清除浮动
为父元素添加overflow：hidden属性
3、组织元素被浮动元素覆盖
在被覆盖的元素中添加BFC属性
三、css层叠上下文
影响z-index，z-index需要结合position属性使用，z-index的数值就是决定元素在z轴方向的层级。
如果层叠上下文元素没有设置z-index，那它也要比普通元素级别高，默认层叠等级为z-index：0。设置定位后，它默认的层级比一般元素高
层叠上下文可以嵌套。
四、盒模型
1、content-box
标准盒模型 不包含border和padding
width: 内容的宽度
height: 内容的高度
2、border-box
IE盒模型 ，包含border和padding
在ie8+浏览器中，默认标准盒模型，可以添加属性box-sizing:border-box转变为IE盒模型。
五、line-height和vertical-align
在 CSS 中有四种内联盒子，分别是：包含框containing box，行框line boxes，行内框inline boxes，内容区content area。
元素默认情况下的对齐方式是通过基线baseline对齐
line-height： 行高。只影响行内元素和其他行内内容，不会直接影响块级元素，会影响到块级元素的内联内容。在块级元素上声明line-height会为该块级元素的内容设置一个最小行框高度。%代表当前字体尺寸的百分比行间距。
小知识：
为什么内容会将盒子撑开？
在inline box模型中，line boxes是看不见的，它的作用就是包裹每行文字。所以一个没有设置height属性的div的高度就是由一个一个line boxes的高度堆积而成的。
vertical-align: 垂直方向布局。对块级元素无效
1015
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
