Untuk hasil dari trik yang akan kita bahas kali ini, mungkin bisa dilihat pada judul posting dan sidebar Blog ini, dimana bagian judul posting dan sidebar, background-nya terlihat timbul dan bagian bawahnya mempunyai efek bayangan. Ok saya kira intermesonya sudah cukup, lagian saya juga tidak terlalu lihai untuk mengurai satu persatu. Kita langsung saja ke topik yang akan kita bahas:
Langkah pertama yang harus kamu lakukan adalah
Masuk melalui account bloger kamu, pilih tab pengaturan ----->>tata letak-->>edit HTML, oh ya jangan lupa untuk mendowload tempelete Blog kamu untuk antisipasi jika trik berikut ini gagal kamu terapkan, jika sudah copy dan paste code berikut (kode warna hijau) di area kode .post h3 {
Atau untuk kamu yang menggunakan browser firefox, cukup tekan tombol F3 dan masukkan kata .post h3
Contoh penggunaannya adalah sebagai berikut :
.post h3 {
margin-top: 0;
font: normal bold 157% Trebuchet, Trebuchet MS, Arial, sans-serif;
letter-spacing: -1px;
color: #0066CC;
height: 40px;
border-bottom:10px groove #ccc;
border-right:4px solid #ccc;
border-left:4px solid #ccc;
background: #444 ;
ket: deskripsi dari kode diatas khusus untuk yang berwarna hijau adalah ,
height: 40px; ,tinggi dari background yang ingin kita pasang
border-bottom:10px groove #ccc; , garis tepi bawah dengan ketebalan 10px
border-right:4px solid #ccc; , garis tepi dibagian kanan dengan ketebalan 4px
border-left:4px solid #ccc; , garis tepi kiri dengan ketebalan 4px
background: #444; , warna latar dari judul posting
border-bottom:10px groove #ccc; , garis tepi bawah dengan ketebalan 10px
border-right:4px solid #ccc; , garis tepi dibagian kanan dengan ketebalan 4px
border-left:4px solid #ccc; , garis tepi kiri dengan ketebalan 4px
background: #444; , warna latar dari judul posting
Mungkin ada yang bertanya apakah contoh kode diatas bersifat absolute?, jawabannya tentu saja tidak, sebab kreasi dari kode CSS diatas masih sangat mungkin untuk dimanipulasi, sesuai kreativitas teman Bloger,.
“ Selamat Mencoba & Semoga Sukses “