CSS3超简单实现按钮效果

CSS3代码

#nav1{
height: 132px;
width: 32px;
background: url(Images/button_bg.png), url(Images/button_index.png) center center no-repeat;
}

#nav1 span {
height: 132px;
width: 32px;
display:block;
background: url(Images/button_bg1.png), url(Images/button_index.png) center center no-repeat;
opacity:0;

}
#nav span:hover{
opacity:1;
transition: all ease-in 0.5s;
}

HTML代码

 <div id=”nav1″><span></span></div>