手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >子div在父div的相对定位css控制
子div在父div的相对定位css控制
摘要:我们在设计页面的时候会遇到,子DIV要控制在父DIV内部的固定位置,而且还有图层上下的关系。这里有个小技巧。父div的position使用r...

 我们在设计页面的时候会遇到,子DIV要控制在父DIV内部的固定位置,而且还有图层上下的关系。这里有个小技巧。

父div的position使用relative,子div的position使用absolute,然后使用left和top进行定位。

如果子div的position使用了fixed,就不能使用left了,则改成margin-left。

这里说的不清楚,只是记录一下。

代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
 <title>Untitled</title>
</head>
<body>
<div style="width:500px; height:1300px; background:#0f0; margin:0 auto; position: relative;">
 <div style="width:300px; height:30px; background:#f00; position: fixed; _position: absolute; top:30px; margin-left:50px; z-index:100;">test!!!!</div>
Hello World!
<div>
</body>
</html>

【子div在父div的相对定位css控制】相关文章:

文字排版在网页制作中应遵守的原则

详解CSS的定位语法应用

div+css相对定位和绝对定位用法实例详解

css的三种定位方式使用探讨

Firefox和IE通用的三则网站重构实用技巧

css中用javascript判断浏览器版本

DIV+CSS常用的网页布局代码

练习层DIV的定位小实例

子元素div高度不确定时父div高度如何自适应

list-style-image无法准确定位通过(li的背景模拟或相对定位)解决

精品推荐
分类导航