position属性用来规定元素的定位类型和方式
①position：static 默认值，没有定位，元素出现在正常的流中；
②position：fixed 固定定位 是相对于浏览器窗口来进行定位；
③position：relative 相对定位 相对于其本身正常位置来进行定位，它原本所占的空间仍保留；
④position：absolute 绝对定位 相对于定位方式不是static的第一个父元素进行定位（往上寻找参照元素，一直到根元素为止，即body），此时元素原先在正常文档流中所占的空间会关闭，就像元素原来不存在一样，绝对定位后会生成一个块级框，而不管它原先在正常流中是何种类型。
选好定位方式后可通过设置 top/right/bottom/left 来设置元素位置，但是对static无用，static定位下是靠margin来移动位置。
注意：当元素设置position：absolute后，再想用 margin：0px auto； 来使元素水平居中是无效的，可进行如下设置：
<style>
.s1{width:100%;height:100%;position:relative;}
.s2{background:yellow;width:300px;height:100px;position:absolute;
left:50%;margin-left:-150px;//是让元素到其相对定位的父元素左边
的距离为该父元素宽度的50%，这时左边边界正好在父元素的中间线上，再左移宽度的一
半正好居中，即再设置margin-top:-150px可使其水平居中
top:50%;margin-top:-50px;//与上述原理相同，设置后可垂直居中}
</style>
<body>
<div class="s1">
<div class="s2">
水平居中
</div>
</div>
</body>
790
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
