设置了z-index，却覆盖不了。。。
来源：2-3 汉克狗的眼窝
ZZZZZzn
2020-04-07 12:05:40
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
body{background-color:yellow;}
.dog{width: 200px;
height: 120px;
background-color: yellow;;
position: relative;
margin: 0px auto;
transform-origin: 50% 0px;}
.etou{width: 200px;
height: 100px;
position: absolute;
top: 8px;
border-radius: 100px/100px 100px 20px 20px;
background-color: #fff;z-index: 1;}
.lianjia{ width: 220px;
height: 80px;
position: absolute;
top: 65px;
left: -10px;
background:#fff;
border-radius: 100%;
margin:0px auto;z-index: 1;}
.xiaba{width: 200px;
height: 60px;
position: absolute;
top: 103px;
left: 50%;
margin-left: -100px;
background: #fff;
border-radius: 100px/0px 0px 65px 65px;z-index: 1;}
.erduo{width: 32px;
height: 140px;
background: blue;
border-radius: 50%;
left: 50%;
transform-origin: 50% 0;
transform: translate(-77px,60px) rotate(13deg);
position: absolute;z-index: 0;}
.erduo.youerduo{
width: 32px;
height: 140px;
background: blue;
border-radius: 50%;
left: 50%;
transform: translate(45px,60px) rotate(-13deg);
position: absolute;
z-index: 0;}
.yanjing{width: 50px;
height: 50px;
border-radius: 25px/27px 25px 25px 4px;
left: 50%;
top: -15px;
transform-origin: 50% 0;
transform: translate(-77px,60px) rotate(13deg);
position: absolute;
z-index: 3;
box-shadow: 2px 0px 0px 0px black inset,-3px -1px 5px -1px #ddd;}
.yanjing.youyanjing{
transform: scale(-1, 1) translate(-30px,60px) rotate(13deg);z-index: 3;
box-shadow: 2px 0px 0px 0px black inset;}
.yinying{width:60px;
height: 60px;
background-color: blue;
position: absolute;
z-index: 1;
left: 66%;
top:38px;
border-radius: 50px/70px 52px 4px 20px;
transform: rotate(-13deg);
}
</style>
</head>
<body>
<div class="dog">
<div class="etou"></div>
<div class="lianjia"></div>
<div class="xiaba"></div>
<div class="erduo"></div>
<div class="erduo youerduo"></div>
<div class="yinying"></div>
<div class="yanjing"></div>
<div class="yanjing youyanjing"></div>
</div>
</body>
</html>
显示：：
阴影哪里没有被眼睛覆盖是怎么回事
1回答
-
好帮手慕星星
2020-04-07
同学你好，是覆盖的，只不过眼睛没有背景色而已，需要手动设置为白色，如下
效果
自己再测试下，祝学习愉快！
1
相似问题
回答 1
回答 1