Kali ini saya akan memberikan sedikit Tutorial "Cara Membuat Efek Hover pada Gambar"
1. Login dulu pastinya di Blogger sobat...
2. Masuk ke pengaturan Template > Klik yang HTML
3. Cari Kode ini ]]></b:skin> atau </style>.
4. Lalu tambahkan Kode Css di bawah ini Tepat di Atas ]]></b:skin> atau </style>.
.post-body img{background:#FFF;/* background color around the image */
padding:15px;/* The Space Between Border and Image */
border-radius:50% 0;/* Rounded border */
box-shadow:0 0 15px #000;/* Shadow */
-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s}
.post-body img:hover{border-radius:0;/* This removes the border roundness (value 0) */
-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;cursor:pointer}
5.Trahir Save.....padding:15px;/* The Space Between Border and Image */
border-radius:50% 0;/* Rounded border */
box-shadow:0 0 15px #000;/* Shadow */
-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s}
.post-body img:hover{border-radius:0;/* This removes the border roundness (value 0) */
-moz-transition:all 1s;-webkit-transition:all 1s;-o-transition:all 1s;cursor:pointer}
Demikian tentang "Cara Membuat Efek Hover Pada Gambar"
No comments:
Post a Comment