1.布局
float:浮动 left | right
会脱离文本流,与文字在一个层
clear:清除浮动 left|right|both(推荐使用)
overflow:超出
auto:自动
hidden:超出部分隐藏
设置超出的时候,会重新测量盒子的高度
一般在子盒子都浮动的时候,给父盒子使用overflow:hidden来清除浮动的影响
display:none(隐藏) | block(以块元素显示) | inline(以行内元素显示)
2.定位
position:absolute(绝对定位) | fixed(固定定位) | relative(相对定位)
absolute:彻底脱离文本流,会随内容滚动
fixed:彻底脱离文本流,不会随内容滚动
relative:不脱离文本流,还占据原来的位置
位置属性:
left:
right:
top:
bottom:
fixed:以浏览器边框为基准,位置属性的值为距离来计算
relative:以盒子原来的位置为基准,位置属性的值为距离来计算
absolute: 1.上层盒子没有定位,以浏览器边框为基准,位置属性的值为距离来计算
2.上层有盒子进行了定位,以最近的上层盒子的边框为基准,位置属性的值为距离来计算