Post title Background, Hover Background Post title

Hi , Ehh ... apa post title nie tulis ? 
Entah ! v_v (fikir)
okay jawapan nya korang nak belajar buat post title ngan hove background post title ?
okay first nak tunjuk MISAL nya hehehe ,

hah ! same jelah mcm kat atas tuh betul x ?? yup kan ? okay nak thu care buat diek ? okay ikut tutor nie :)
Dashboard > Layout > Edit Html > Tick Expand Widget :-
ikut cara kat bawh nie okay ...
First korang Cari kod kat bawah nie (Ctrl F )

.comments h4 {

okay dah jumpa ? klau dh jumper cube tgk kat bawh  ".comments h4 {" ada kod seakan2x mcm nie

.comments h4 {
  margin: 1em 0 0;
  font: $(post.title.font);
}

okay then korang copy kod nie  :-

.post-title;
margin: 0px;
padding: 0px;
font-size: 115%;
font-weight: Normal;
font-color: #F778A1;
line-height: 1.1em;
text-align:center;
background-position:center;
background-repeat:no-repeat;
border-top:2px solid #F5A9A9;
border-bottom: 2px solid #F5A9A9;
background: url(URL GAMBAR);
} 

pastekan mcm nie .

.comments h4 {
  margin: 1em 0 0;
  font: $(post.title.font);
}
.post-title;
margin: 0px;
padding: 0px;
font-size: 115%;
font-weight: Normal;
font-color: #F778A1;
line-height: 1.1em;
text-align:center;
background-position:center;
background-repeat:no-repeat;
border-top:2px solid #F5A9A9;
border-bottom: 2px solid #F5A9A9;
background: url(URL GAMBAR);
} 

okay ? preview dlu .. then klau x dek error save truh okay :)

 Hover Background Post title :-

okay mcm biase cari kod mcm di atas kemudian paste kan kod nie jugak dibawah kod yg same

.post-title;
margin: 0px;
padding: 0px;
font-size: 115%;
font-weight: Normal;
font-color: #F778A1;
line-height: 1.1em;
text-align:center;
background-position:center;
background-repeat:no-repeat;
border-top:2px solid #F5A9A9;
border-bottom: 2px solid #F5A9A9;
background: url(URL GAMBAR);
}

Yg berwarna oren itu tukar kan dengan :-

.post-title:hover { 

okay save .. lepas tuh tgk okay :) !


emm sebelum terlupa klau korang nak buat korang punyer post title punyer font bershadow korang tambah kan kod nie ..

text-shadow: 3px 1px 2px #000000;
-webkit-transition: 1s;

 contoh nyer macam nie :-

.post-title; atau .post-title:hover {
margin: 0px;
padding: 0px;
font-size: 115%;
font-weight: Normal;
font-color: #F778A1;
line-height: 1.1em;
text-align:center;
background-position:center;
background-repeat:no-repeat;
border-top:2px solid #F5A9A9;
border-bottom: 2px solid #F5A9A9;
text-shadow: 3px 1px 2px #000000;
-webkit-transition: 1s;
background: url(URL GAMBAR);
}

siap save ler okay :)


merah - warna border

biru - warna shadow

unggu - url background

klau nak cari kod warne bleh cari >>DI SINI<<