时间:2021-04-16
下面是CSS实现两个层重叠与显示的代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style type="text/css">
#father{
position:relative;
margin:20px auto;
width:400px;
height:100px;
border:1px solid red;
}
#father #a{
position:absolute;
width:100%;
height:50px;
background:blue;
opacity:0.6;
z-index:2;
}
#father #b{
position:absolute;
width:100%;
height:80px;
background:#F4AF19;
text-align:right;
z-index:1;
}
</style>
</head>
<body>
<!--按上面的CSS定位方法布局就会重叠,那个子盒子在前面用Z-INDEX 决定-->
<div id="father">
<div id="a">我是A盒子</div>
<div id="b">我是B盒子</div>
</div>
</body>
</html>
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
遮罩层必须至少有两个图层,上面的一个图层为"遮罩层",下面的称"被遮罩层";这两个图层中只有相重叠的地方才会被显示。下面就教大家如何创建遮罩层动画。 1、
在web前端的日常工作中,经常会遇到设计师设计稿上不同模块重叠显示的需求。而要将两个不同模块重叠显示通常是通过CSS中的position属性来设置的。Posit
在使用opacity属性来实现页面整体透明的时候,发现了一个问题。如果两个层发生了重叠,使用了opacity属性并且属性值小于1的层,会覆盖掉后面的层。于是动手
在最近的一个作品中,在使用opacity属性来实现页面整体透明的时候,发现了一个问题。如果两个层发生了重叠,使用了opacity属性并且属性值小于1的层,会覆盖
解决的办法是:做两个浮动层,一个浮动层的根标签是IFrame,另一个浮动层的根标签是Div,两个浮动层的位置、大小均相等,然后先显示IFrame浮动层,再显示D