CSS中的定位（position）
来源：互联网 作者：未知 发布时间：2007-12-22
使用CSS来定位页面内层的位置，一直是比较难以掌握的事情，很多时候，往往被绝对定位的元素，总是以浏览器的左上角为坐标原点，此时，如果浏览器的大小改变，被定义的层就会偏离设计想要的位置，让人很挠头。 其实，要想控制好层的绝对定位，只要理解CSS中关于定位（po
以下为引用的内容：
<body>
<div id="box">
<div id="nav">
<p>每个显示元素都可以用定位的方法来描述，而其位置由此元素的<strong>包含块</strong>来决定的。</p>
</div>
</div>
</body>
|
此时，如果你要对nav绝对定位，则需设置css：
以下为引用的内容：
body {
margin:0;
padding:0;
text-align:center;
}
#box{
background:#ff0;
position:relative; /* 使box层成为其子孙元素的包含块 */
width:500px;
height:200px;
margin:0 auto;
}
#nav {
background:#ccc;
position:absolute; /* nav层将在box层的边框范围内绝对定位 */
top:20px;
left:40px;
width:200px;
}
|
其显示效果如图3所示。
因此，掌握了包含块的概念，定位就变得不那么困难了。
