/*无javascript代码，请查看html与css代码*/
<!-- 容器 -->
<div class="container-box radius-box">
<!-- logo -->
<img class="logo radius-box" src="http://pic.cnblogs.com/avatar/387969/20141021152547.png" alt="logo图片"/>
<!-- logo end -->
</div>
<!-- 容器 end -->
/************** 圆角边框样式 ******************/
.radius-box {
border-radius: 100px;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
-o-border-radius: 100px;
}
/************** 容器样式 ******************/
.container-box {
width: 100px;
height: 100px;
border: solid 5px #ccc;
}
/************** logo样式 ******************/
.logo {
width: 100px;
height: 100px;
border: solid 5px #ffffff;
box-sizing: border-box;
opacity: 1;
transition: opacity 1s ease .1s;
-webkit-transition: opacity 1s ease .1s; /* Safari 和 Chrome */
-moz-transition: opacity 1s ease .1s; /* Firefox 4 */
-o-transition: opacity 1s ease .1s;/* Opera */
}
/************** logo:hover状态下将opacity改为0 ******************/
.logo:hover {
opacity: 0;
}