为了账号安全,请及时绑定邮箱和手机立即绑定

为什么设置的z-index不能用?

body{background: #ccc}

h1{

text-align: center;

       

}


.chao{

width: 960px;

height: 200px;

margin: 60px auto;

position:relative;

border: 0.5px dashed #ccc

}

img{padding:10px 10px 15px;

background: #fff;

border: 1px solid #ddd;

position: absolute;

-webkit-transition: 1s;

-moz-transition: 1s;

transition: 0.5s;

       z-index:1;

}

img:hover{

background: #fff;

-webkit-transform:rotate(0deg);

-moz-transform:rotate(0deg);

transform: rotate(0deg);

-webkit-transform: scale(1.5);

-moz-transform: scale(1.5);

transform: scale(1.5);

box-shadow: 10px 10px 15px #ccc

z-index:2000;

}

.pic1{

left: 200px;

top: 0px;

-webkit-transform:rotate(-15deg);

-moz-transform:rotate(-15deg);

transform:rotate(-15deg);

}

.pic2{

left: 350px;

top: 10px;

-webkit-transform:rotate(15deg);

-moz-transform:rotate(15deg);

transform:rotate(15deg);

}

.pic3{

left: 700px;

top: 50px;

-webkit-transform:rotate(30deg);

-moz-transform:rotate(30deg);

transform:rotate(30deg);

}

.pic4{

left: 500px;

top: 30px;

-webkit-transform:rotate(-25deg);

-moz-transform:rotate(-25deg);

transform:rotate(-25deg);

}

.pic5{

left: 0px;

top: 200px;

-webkit-transform:rotate(15deg);

-moz-transform:rotate(15deg);

transform:rotate(15deg);

}

.pic6{

left: 200px;

top: 200px;

-webkit-transform:rotate(55deg);

-moz-transform:rotate(55deg);

transform:rotate(55deg);

}

.pic7{

left: 400px;

top: 200px;

-webkit-transform:rotate(-35deg);

-moz-transform:rotate(-35deg);

transform:rotate(-35deg);

}

.pic8{

left: 600px;

top: 200px;

-webkit-transform:rotate(15deg);

-moz-transform:rotate(15deg);

transform:rotate(15deg);

}

.pic9{

left: 700px;

top: 200px;

-webkit-transform:rotate(-15deg);

-moz-transform:rotate(-15deg);

transform:rotate(-15deg);

}

.pic10{

left: 0px;

top: 0px;

-webkit-transform:rotate(-15deg);

-moz-transform:rotate(-15deg);

transform:rotate(-15deg);

}

http://img1.sycdn.imooc.com//59b37d6000017a9703110456.jpg

正在回答

1 回答

要想给元素设置z-index样式,必须先让它变成定位元素,再通俗一点说,就是要给元素设置一个postion:relative

不要给想控制“上、下”的元素设置z-index,而是对他们的父容器设置z-index样式。


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

为什么设置的z-index不能用?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信