css定位小结 1216

css定位小结 1216

定位的分类

static
relative
absolute
fixed

static 标准的 默认的

默认的定位，没有偏移效果

除了它外的所有其它定位，都会具有偏移的能力

relative 相对定位

特点：

• 偏移参考，以自身为参考
• 原来的位置，占据文档流
• 当它发生偏移后，新位置是不占文档流的，新位置只是一个残影而已

absolute 绝对定位

特点：

• 偏移参考，定位了的父级元素，如果父级没有定位，就找父级的父级，直到找到body
• 脱离文档流

fixed 固定定位

特点：

• 偏移参考，浏览器窗体为参考
• 脱离文档流

定位的特性

• 定位的元素（除去默认情况）都会获得新的能力（属性），边偏移
• 边偏移包括：left right top bottom
• 定位的标签，display会发生变化，变成类似于inline-block的元素