5个回答
展开全部
如果只是单纯的一个浮动到另一个上面，就用相对绝对定位，如果要跟日历一样的话，就要使用js了
<!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>
<!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>
追问
我知道了，是我右边的装图片的这个层用了position:relative;是不是z-index遇到position就不管用了？
追答
不用position，z-index，就失效了。。。。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
研究一下css的position以及 z-index属性。
给你一个实例：
<!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=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div style="position:relative; width:200px; height:200px; background:#009">
<div style="width:100px; height:100px; position:absolute; top:80px; right:-20px; background:#900; z-index:999">我在上面</div>
</div>
</body>
</html>
祝你成功！
给你一个实例：
<!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=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div style="position:relative; width:200px; height:200px; background:#009">
<div style="width:100px; height:100px; position:absolute; top:80px; right:-20px; background:#900; z-index:999">我在上面</div>
</div>
</body>
</html>
祝你成功！
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
如果在框架边缘,那么框架内的层无法跨越框架,如果不是框架的原因.给你想显示在上层的DIV元素的zIndex样式指定一个比较大的数值.比如style="zIndex:9999;"
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
这个效果是用ajax 实现的
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
