Cara membuat efek hover dengan css pada judul postingan

Assalamuaaikum...apa kabar sobat....?kita jumpa lagi dalam artikel yang akan bahas kali ini yaitu tentang cara membuat efek hover dengan css pada judul postingan,tampilan ini memang cukup menarik untuk di pasang pada blog sobat,dengan tampilan tampilan efek css memberikan kenyamanan dan mempunyai kesan tersendiri,baiklah buat sobat yang ingin mencobanya silahkan perhatikan tutorialnya berikut ini.

1. Seperti biasa login dulu ke blog sobat.
2. Pilih menu Rancangan > Edit HTML (jangan lupa ceklist kotak kecil atas)
3. kemudian cari kode </head>
4. masukkan kode berikut dan taruh diatas kode </head>

Quote:
<style type='text/css'>
h3{font-family:veranda !important; font-style:italic !important}
.post h3{color:#666; border-left:10px solid #666; border-right:10px solid #666; padding:3px 5px 3px 20px; border-radius:15px; -moz-border-radius:15px; box-shadow:0px 0px 13px #666; -webkit-box-shadow:0px 0px 13px #666; -moz-box-shadow:0px 0px 13px #666}
.post h3:hover{color:#FF133F; border-left:10px solid #FF133F; border-right:10px solid #FF133F; box-shadow:0px 0px 13px #FF133F; -webkit-box-shadow:0px 0px 13px #FF133F; -moz-box-shadow:0px 0px 13px #FF133F}
</style>


5.kemudian save atau simpan template dan silahkan lihat hasilnya.
Demikianlah tutorial kali ini,bagi yang tertarik silahkan coba langsung.
Share artikel ke: Facebook Google+ Twitter Digg

0 komentar:

Posting Komentar