- Code:
<style type="text/css">
.CircleHover img{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;transition:all 0.5s ease;padding:4px;background: #eee;background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa));background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa);-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;-webkit-box-shadow: 0 0 3px rgba(0,0,0,.7);-moz-box-shadow: 0 0 3px rgba(0,0,0,.7);box-shadow: 0 0 3px rgba(0,0,0,.7);}
.CircleHover img:hover{-moz-transform: scale(1.2) rotate(-350deg);-webkit-transform: scale(1.2) rotate(-350deg);-o-transform: scale(1.2) rotate(-350deg);-ms-transform: scale(1.2) rotate(-350deg);transform: scale(1.2) rotate(-350deg);-webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);-moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);}
</style>
<a href="/" class="CircleHover"><img src="http://1.bp.blogspot.com/-Sq5DlDe6gzc/UAUDPbvmDGI/AAAAAAAAI2E/x4K4sNjUDVA/s200/code1k_circle_1.jpg" alt="" /></a>
Admin
1 Thuộc tính xoay tròn CSS Thu Nov 28, 2013 11:21 am
tester
2 Re: Thuộc tính xoay tròn CSS Fri Dec 13, 2013 10:22 am
Permissions in this forum:
Bạn không có quyền trả lời bài viết
|
|