CSS教學－hover滑入圖片時，加入CSS3動畫特效「淡入淡出」變換圖片

.hover {position:relative;}
.hover img {
position:absolute;
/* CSS3淡出淡入效果,1秒 */
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
transition: opacity 1s ease-in-out;
}
.hover img:nth-of-type(2):hover{
opacity:0; /滑鼠滑入時，透明度變0/
}

<div class="hover">
  <img src="images/01.jpg" />
  <img src="images/02.jpg" />
</div>