Wednesday, 14 November 2012

NgeShare - Cara Buat Sudut Lengkung dan Bayangan Pada Blog

Kali ini saya akan membagikan tips bagaimana membuat tampilan pada sudut blog Anda menjadi lengkung atau bisa dibilang rounded rectangle plus efek bayangan. Caranya mudah, Anda hanya tinggal menyisipkan sebuah script code.

Penerapannya, misalnya saya ingin membuat tampilan sudut gambar di artikel saya menjadi melengkung. Yang harus saya lakukan adalah masuk ke halaman Blogger -> kemudian pilih Template -> Edit HTML.
Dikarenakan saya akan merubah tampilan sudut gambar di artikel saya menjadi melengkung, maka yang harus saya cari adalah code HTML .post img {, agar lebih cepat untuk menemukan code tersebut kita tekan tombol CTRL+F di keyboard. Jika sudah ketemu code .post-body img {, kita sisipkan script code di bawah ini setelah atau di bawah code .post img {:
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
-webkit-box-shadow: 0px 1px 6px #000000;
-moz-box-shadow: 0px 1px 6px #000000;
box-shadow: 0px 1px 6px #000000;
Maka tampilan sudut gambar pada artikel saya akan berubah melengkung seperti di bawah ini:
 
 
Copyright © 2011-2017 | Surya Blog