Tutorial - Elegant Image Border

Contoh Elegant Image Border
Pada kesempatan kali ini D Rian mau memberikan tutorial tentang Elegant Image Border yang saya ambil dari Elegant Image Frame . Untuk membuat Elegant Image Border kita menggunakan Border solid dan sedikit CSS3 sebagai pelengkap.
Berikut Tutorialnya:
1. Masuk ke dasbor
2. Pilih Rancangan >>> Edit Html
3. Cari kode ]]></b:skin> (dengan ctrl+f)
4. Tambahkan kode css dibawah ini sebelum kode ]]></b:skin>


.elegant {
border: 6px solid white;
-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.3);
-moz-box-shadow: 2px 2px 6px rgba(0,0,0,0.3);
box-shadow: 2px 2px 6px rgba(0,0,0,0.3);
}
5. Simpan Template

Untuk menggunakannya kita hanya perlu menambahkan class="elegant" pada kode gambar contoh:
<img class="elegant" src="Image URL" alt="" border="0" />

4 komentar:

Perpustakaan Antropologi mengatakan...

Mantap sob... aku bikin blog buat praktek ah...

faiz mengatakan...

wah nambah informasi ni

Dhana/戴安娜 mengatakan...

salam sahabat
ehm cocock sekali saya suka imege tersebut,kayaknya saya temukan gambar ini pula saat hendak login mas..oh iya followers pertama lhoh good luck

Beben mengatakan...

ck ck ck pake box shadows...
mantap!!!
salam blogger \m/

Posting Komentar