CSS中的定位（position） - PHP程序员站--PHP程序员之家 PHP新手教程 PHP高级技巧 PHP新闻 PHP源码下载 PHP专题 Zend产品

| 论坛登录 | 游客访问 | 免费注册 | 忘记密码

RSS订阅

高级搜索

收藏本站

当前位置：主页 >> 网页制作 >> CSS >> 文章内容

CSS中的定位（position）

[收藏此页] [打印本页]

来源：互联网作者：未知发布时间：2007-12-22

以下为引用的内容：
<body>
<div id="box">
<div id="nav">
<p>每个显示元素都可以用定位的方法来描述，而其位置由此元素的<strong>包含块</strong>来决定的。</p>

</div>
</div>
</body> www~phperz~com

　　此时，如果你要对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;
} php程序员站

www~phperz~com

　　其显示效果如图3所示。 phperz.com

　　因此，掌握了包含块的概念，定位就变得不那么困难了。 www.phperz.com

[收藏此页] [打印本页] [返回顶部]

上一篇：在IE流览器中正确显示PNG透明图片下一篇：水平对齐(text-align)

·css布局时需注意的几点
·css属性之9、用户界面属性
·css属性之8、表格属性
·css属性之7、列表属性：
·css属性之6、文本（Text）属性
·css属性之5、字体（Font）属性
·css属性之4、颜色和背景（Color and Background）属性
·css属性之3、布局（Layout）属性
·css属性之2、BOX模型（BOX Model）属性
·css属性之1、媒体（Media）类型

发表评论

全部评论(0条)

站内搜索
热门搜索　mysql 　基础　 adodb 　url

高级搜索网站地图站长工具 IP查询收藏本站

热点文章

·div+css:tab风格导航
·IE浏览器中让PNG图片透明
·让文章里图片自动缩小的几种方法
·css之自动换行
·水平对齐(text-align)
·五日精通CSS层叠样式表之第一日(2)
·css做的一个很漂亮的分页导航
·CSS+DIV实现的表单效果
·css定位详解与应用
·五日精通CSS层叠样式表之第三日(3)
·CSS兼容性解决方法 !important的IE7问题
·网页标准中的关于UTF-8编码的问题
·IE与Firefox的CSS兼容大全
·IE 6.0 Firefox Opera 下使背景PNG图片透明
·五日精通CSS层叠样式表之第五日(2)

网站首页 | 网站地图 | 高级搜索 | RSS订阅