想用纯CSS在头像后做一个简单的动画效果,想的是俩个图片重合,这样动画效果不影响前面的头像hover事件,进行框架设计时发现这样需要讲俩个div重合
Body:
<div id="img_head" >
<img src="img/首页logo.png" class="head">
</div>
<div id="img_head_back">
<img src="img/背景.png" class="back" >
</div>
CSS:
#img_head{
border: 1px solid #FF0000;
position:absolute;
210px;
height: 210px;
z-index: 20;
left:600px;
top:170px;
text-align: center;
}
#img_head_back{
border: 0px solid #FF0000;
position:absolute;
210px;
height: 210px;
left:600px;
top:170px;
z-index:10;
}
利用Z-index确定那个div在最上层
前提是position:absolute