CSS定位布局

定位布局（Positioning）

相对定位、绝对定位、固定定位元素都有定位属性left,right,top,bottom。

静态定位（Staticpositioning） position:static;

• 是所有元素的默认定位方式。意味着将一个元素定位在默认文档流中。

搭配top，left没有效果

相对定位（Relativepositioning） position:relative;

• 与静态定位相似
• 不脱离文档流，原先位置保留
• 如果不设置top,bottom,left,right属性，依然在原位置
• 对于相对定位的元素我们可以通过属性top,bottom,left,right来改变元素最终的位置。元素移动的时候是相对于【当前元素所在的位置】进行移动。

相对定位，相对于原来的位置进行移动

利用相对定位制作一个左中右的覆盖布局

left，right元素会定位在center元素的上层，设置定位position：relative；再对元素进行top，bottom设置，但是元素之前所在位置还会有占位，会出现空隙。