Wednesday 31 July 2013

Membuat Kotak Indah Sebagai Pembungkus Widged




Pada postingan ini saya akan menjelaskan tentang cara mebuat suatu kotak pembungkus setiap widged pada tampilan blog kita dengan animasi2 blog yang standar tentunya anda pasti ingin membuat tampilan baru pada blog anda nah salah satunya tips ini mungkin bisa anda coba...

Masuk Blog anda
pilih menu template/edit html
cari kode ]]></b:skin> gunakan ctrl + f  untuk memudahkan anda
jika sudah ketemu letakan kode dibawah ini tepat diatas tag ]]></b:skin>

#sidebar .widget{
     margin: 20px 4px;
     border: 1px solid #999;
     padding: 10px 6px;
     border-radius: 8px;
     -moz-border-radius: 8px;
     -webkit-border-radius: 8px;
     box-shadow: -1px -1px 1px #666, 1px 1px 1px #666, 1px 1px 10px #0000CD;
     -moz-box-shadow: -1px -1px 1px #666, 1px 1px 1px #666, 1px 1px 10px #0000CD;
     -webkit-box-shadow: -1px -1px 1px #666, 1px 1px 1px #666, 1px 1px 10px #0000CD;
     -o-transition: 1s ease-out;
     -moz-transition: 1s ease-out;
     -webkit-transition: 1s ease-out;
}
#sidebar .widget:hover {
     border-radius: 15px;
     -moz-border-radius: 15px;
     -webkit-border-radius: 15px;
     box-shadow: -1px -1px 1px #666, 1px 1px 1px #666, 1px 1px 20px #0000CD;
     -moz-box-shadow: -1px -1px 1px #666, 1px 1px 1px #666, 1px 1px 20px #0000CD;
     -webkit-box-shadow: -1px -1px 1px #666, 1px 1px 1px #666, 1px 1px 20px #0000CD;
}



 Langkah terakhir silahkan simpan template anda dan lihat hasilnya...
selamat mencoba semoga bermanfaat....

No comments:

Post a Comment

Silahkan Komen Rider,