盒模型布局常见问题总结
盒模型布局常见问题：
1.BFC内部的盒子会垂直排列，即一个盒子总是会占据一行，即使两个盒模型的宽度加起来没有父元素宽，都会分为两行显示。--block元素的特点
2.属于同一BFC的相邻盒子的垂直margin会重叠。--使用一个BFC盒子包裹其一
3.盒子内部元素的 margin-box 左边会与包含块 border-box 的左边相接，即使存在浮动也如此。--触发BFC解决
4.盒子内部元素浮动时，盒子高度没有被撑开。--触发BFC解决
demo页面请点击
注：默认只有body元素触发BFC（块级作用域上下文）
文章图片
css盒模型 盒模型特点：
1. 默认宽度为父元素的宽度
2. 默认高度为子元素的高度
3. 可以指定高度和宽度
BFC特点：
1. BFC不与float box叠加；
2. BFC内外部元素互不影响；
【盒模型布局常见问题总结】3. 计算BFC高度时，浮动元素也参与计算。
推荐阅读
- Flutter的ListView
- 一般模型化关系——从模型是什么到如何起作用的基本答案
- 织网布局，社群营销走进山东玖零落地企业
- 玩具测评丨BANDAI万代神奇宝贝小镇盒玩
- Pytorch学习|sklearn-SVM 模型保存、交叉验证与网格搜索
- 空盒传奇
- 旅途碎碎念
- 瀑布流布局
- 2018-12-03-新手教程重构思路
- Cell|Cell Biolabs丨艾美捷丨α-酮戊二酸分析试剂盒