值
描述
static
預設值。沒有定位，元素出現在正常的流中。
（忽略 top, bottom, left, right 或者 z-index 聲明）。
relative
生成相對定位的元素，相對于其正常位置進行定位。
（元素的位置可以通過 "left","top"屬性進行規定）。
absolute
生成絕對定位的元素，相對于static 定位以外的第一個父元素進行定位。（元素的位置隻能通過"left", "top", "right" 以及"bottom" 屬性進行規定）。
fixed
生成絕對定位的元素，相對于浏覽器視窗進行定位。
（元素的位置隻能通過 "left","top", "right" 以及"bottom" 屬性進行規定）。
inherit
規定應該從父元素繼承 position 屬性的值。
首先初始化樣式：
* {
padding:0px;
margin:0px;
}
html,body {
background-color: lightgray;
width: 100%;
height: 100%;
1、static預設定位：
#div1{
width: 200px;
height: 200px;
background-color: #FF66FF;
<body>
<div id="div1">
div1
</div>
</body>
<a href="http://s3.51cto.com/wyfs02/M02/6D/8E/wKioL1VmhiKyY9nZAABaYjACd4M130.jpg" target="_blank"></a>
<a href="http://s3.51cto.com/wyfs02/M02/6D/92/wKiom1VmhLKxqwOlAAB1BhJUZ-Y447.jpg" target="_blank"></a>
<a href="http://s3.51cto.com/wyfs02/M01/6D/92/wKiom1VmhOOTRYUMAABtFqf2ZkE661.jpg" target="_blank"></a>
<a href="http://s3.51cto.com/wyfs02/M01/6D/8E/wKioL1Vmhq6SG89kAACGJbRJVaE368.jpg" target="_blank"></a>
本文轉自 yntmdr 51CTO部落格，原文連結：http://blog.51cto.com/yntmdr/1655872，如需轉載請自行聯系原作者
![CSS布局之-浮動(Float)與定位(Position)-讓盒子飛！[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)