通过设置变换(旋转)取消z-index使用transform属性,z-index被取消并出现在前面。(当注释掉-webkit-transform时,z-index在下面的代码中正常工作).test {
width: 150px;
height: 40px;
margin: 30px;
line-height: 40px;
position: relative;
background: white;
-webkit-transform: rotate(10deg);}.test:after {
width: 100px;
height: 35px;
content: "";
position: absolute;
top: 0;
right: 2px;
-webkit-box-shadow: 0 5px 5px #999;
/* Safari and Chrome */
-webkit-transform: rotate(3deg);
/* Safari and Chrome */
transform: rotate(3deg);
z-index: -1;}<html><head>
<title>transform</title>
<link rel="stylesheet" type="text/css" href="transformtest.css"></head><body>
<div class="test">z-index is canceled.</div></body></html>transform和z-index如何协同工作?
- 3 回答
- 0 关注
- 650 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消