<!doctype html public "-//W3C//dtd xhtml 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>绝对定位相对定位</title>
<style>
* { margin: 0; padding: 0; }
.fj1 { width: 150px; position: relative; height: 150px; border: 1px solid #000; background: #999; margin: 0 auto; }
.zj1, .zj2 { width: 50px; height: 50px; position: absolute; right: -20px; top: 20px; border: 1px solid #F00; background: #FFF; z-index: 3 }
.zj2 { right: -50px; top: 40px; z-index: 4; background: #903; border: 1px solid #093; }
</style>
</head>
<body>
<div class="fj1"> 我在下面
<div class="zj1">我浮动在上面</div>
<div class="zj2">我浮动最上面</div>
</div>
</body>
</html>
扫一扫
3082
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
