前端05

内联元素的盒模型

可以设置水平方向的内边距和边框
也支持水平方向的外边距但不支持垂直的外边距
内联元素不支持宽和高

visibility和display

display:none ;(此元素不会显示)
display:block;(将内联元素转成块元素)
visibility:hidden;(元素会消失)

visibility+hidden和display+none的区别:
使用display+none,元素消失后不会再占用面积,而visibility+hidden,元素消失后还会占用面积.

overflow(溢出)

超出父元素的内容叫溢出的内容
如何处理溢出的内容:hidden修剪,并且其余内容使不可见
scroll:滚动条
auto:自动添加滚动条

文档流

最基础的一层,文档就是网页,每一个网页就是一个文档
块元素在文档流中如果设置宽和高就默认为设置的宽和高,设置padding会影响盒子的大小,如果没设置宽就默认父元素宽的100%，高的话是由内容决定，内容有多高，它就有多高
内联元素只占自身的宽和高

浮动

可选值:float:none不浮动
float:left左浮动
float:right右浮动
内联浮动
所有的内联元素如果脱离文档流就会变成块元素，内联元素是不支持宽和高，如果变成块元素就会生效。

高度塌陷

本来父元素是由子元素抻开的，子元素设置了浮动之后，子元素就脱离文档流了，父元素无法抻开，就会形成高度塌陷
解决方法
BFC
父元素的垂直外边距不会和子元素重叠
开启BFC的元素不会被浮动元素所覆盖
开启BFC的元素可以包含浮动的子元素
兼容IE用haslayout zom:1;