不再回头 .net学习日记&资料

我再也不愿听你要求 我受够了你那些自私要求

  IT博客 :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理 ::
  39 随笔 :: 2 文章 :: 14 评论 :: 0 Trackbacks
<style>
body
{margin: 30px; font-size:9pt;}

.a, .b, .c, .d, .e
{
width: 100px;
height: 100px;
margin: 5 auto;
color: #fff;
background: #000;
}
.aa, .bb, .cc, .dd, .ee
{
top: 10px;
left: 10px;
width: 10px;
height: 10px;
overflow: hidden;
background: #F90;
}
.b, .d, .e
{position: relative;}
.cc, .dd, .ee
{position: absolute;}
</style>

<div class="a">
<div class="aa"></div>
A:均不设置postion,一般嵌套关系
</div>

<div class="b">
<div class="bb"></div>
B:仅外div设置relative,一般嵌套关系
</div>

<div class="c">
<div class="cc"></div>
C:仅内div设置absolute,文档中为嵌套关系,页面中内div浮起[非float],相对于页面定位,与外div无关。
</div>

<div class="d" style="background:#ff0000">
<div class="dd" ></div>
D:外div设置relative,内div设置absolute,内div浮起来并相对于外div定位
</div>

<div class="d" style="background:#ff0000">
<div class="dd" style="position:relative"></div>
D:外div设置relative,内div设置relative,内div浮起来并相对于外div定位
</div>

<div class="e">
<div class="ee" style="left: -10px;"></div>
E:这个是说明边界问题。-10 != 反向10px间距
</div>
posted on 2006-04-02 09:18 不再回头 阅读(10326) 评论(3)  编辑 收藏 引用 所属分类: 网站建设

评论

# re: 关于div相对定位和div绝对定位的说明实例 2009-08-25 16:36 f
ddddd  回复  更多评论
  

# re: 关于div相对定位和div绝对定位的说明实例 2009-08-25 16:36 pp
@f
ppppppppp  回复  更多评论
  

# re: 关于div相对定位和div绝对定位的说明实例 2009-12-15 08:09 C#C++
很简洁明了,不错  回复  更多评论
  

只有注册用户登录后才能发表评论。