盒子塌陷 问题中
先我什么都盒子会塌陷
当父盒子内元素浮动后脱离标准流,父盒子没有了儿子支撑,就形成了高度塌陷
解决塌陷的方法:
1,给父盒子设置高度,让其直接撑开(缺点容易使盒子固定 不同比例下用户观感不好)
2 ,让父盒子浮动{
3,设置清除伪元素的属性
overf hidden (缺点容易删除需要的内容)
overflow:auto; 有可能出现滚动条,影响美观
给父盒子设置clearfix
- BFC区域
BFC 块格式化上下文 是块盒子布局移动的区域,也是浮动元素与其他元素交互的区域
html标签是BFC
浮动元素是BFC
行内块元素是BFC
BFC的特点:BFC区域会默认包裹其子元素,标准流,浮动
- 设置非 float: none (默认) 的浮动
- 设置非 overflow: visible (默认) 控制内容溢出元素框时显示的方式
- 设置非 position:static(默认) / relative 的定位类型
- 设置display:inline-block / table-cell / table-caption 为任何一个
BFC就是创建一块不受干扰也不被干扰的区域