绝对定位
position: absolute 绝对定位元素脱离正常文档流，相对其定位上下文（Positioning Context）进行定位。
定位上下文 Positioning Context
-
定位上下文就是值绝对定位元素相对哪个元素定位，默认的定位上下文是
<html>。 -
假如你想设定某个绝对定位元素的定位上下文，则需要在这个元素的某个祖先元素上设置
position: relative。
http://js.jirengu.com/lifif/1/edit?html,css,output
我们在使用绝对定位时候要选好参考点。一般参考点选取父容器，给父容器加上
position: relative
后记（绝对定位的特性）：
1.加了绝对定位宽度收缩（类似浮动）。
原来
绝对定位后宽度收缩
-
行内元素可以加宽
image.png
用 inline-block 还是 浮动
- inline-block 优势: 不需要清除浮动，简单，在设置居中时更方便,适合子内容不多的元素水平排列
- inline-block 劣势: 需要注意缝隙，注意对齐，ie8以下不能用
- float优势: 兼容性好，没缝隙问题
- float劣势: 需要清除浮动，适合稍大的布局
用 定位 还是 浮动
- 大布局、自适应 用浮动
- 小元素、固定宽高 用定位
- 结合实际情况是关键
网友评论