CSS网页布局:关于定位(position)

2020-05-09 07:33:43易采站长站整理

inherit : 这个值从其上级元素继承得到。

示例:

div{…}{position:absolute;bottom:1in;left:1in;right:1in;top:1in;}
div{…}{position:relative;top:-3px;left:6px;}

既然了解了包含块的概念,那么对于相对定位和绝对定位的关系,就很好掌握了。
例如,现在需要把页面内容整体居中,然后再将其中某些层绝对定位的话,那就要把最外面的层设置定位属性。

<body>
<divid="box">
<divid="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;