元素定位：
1. 正常文档流，从上向下，行内从左向右
2. 浮动float，在正常的文档流位置显示，根据属性值向左或向右浮动，带来的影响是兄弟元素会在其下面的位置以正常的文档流出现，文字不会被覆盖。
3. 绝对定位 position: absolute; 如果没有设置坐标值（top left right bottom），那么在正常的文档流位置显示，兄弟元素会在其下面显示，文字会被覆盖。
BFC Block Formatting Context 块级格式化上下文
如果一个元素被触发了BFC，那么它内部的元素无论如何布局都不会影响外面的元素，相当于一个独立的与外部隔离的盒子
浮动布局和绝对定位对其他元素的影响：
1️⃣ 父元素高度塌陷
2️⃣ 兄弟遮盖
3️⃣ 外边距合并
触发BFC
① 父元素设置高度值
② 父元素尾部加一个空div，设置clear:both
③ 父元素加一个伪元素 clear{zoom:1} clear::after{content:""; display:block; clear:both;}
④ 父元素也设置为浮动，即float:left | right;
⑤ position: absolute | fixed
⑥ overflow: hidden | auto | scroll（除了visible以外）
⑦ display: inline-block | table-cell | table-caption | flex | inline-flex
hasLayout是什么？
hasLayout可以简单看作是IE5.5/6/7中的BFC(Block Formatting Context)
当hasLayout为true时(就是所谓的"拥有布局")，相当于元素产生新BFC，元素自己对自身内容进行组织和尺寸计算;
默认hasLayout==true的元素
<html>, <body>
<table>, <tr>, <th>, <td>
<img>,<hr>
<input>, <button>, <select>, <textarea>, <fieldset>, <legend>
<iframe>, <embed>, <object>, <applet>,<marquee>
133
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
