25 September 2011

Tutorial : Underline Background

Assalammualaikum

tutorial underline yang saya nak buat ni ada dua jenis ye . satu untuk background ada image dan satu lagi background berwarna .  contoh tengok bawah ni .



BACKGROUND YANG ADA IMAGE

1. Dashboard > Design > Edit html > tick Expand Widget Templates

2. cari code ni :
u {

3. kalau tak ada copy code ni u { paste atas /* Header

4. copy code ni , paste selepas u {
text-decoration:none;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAyuFwVspVPjuZI4EFPqluQ6fJCDC7dSFHse1w2cjI76pbm3BBspWx2feJhjB6TiIFCC0ZGck_bGulsDzD-NRaYIt3kr5_oLhCahnxic9WutzA_mFQTvENyS_bDy7L8erNBJiMIAfa099-/s400/dgray.png);
padding-top:8px;
padding-bottom:12px;
}
5. preview & save

note :
merah tu gantikan dengan url image korang .
biru tu size font . kalau nampak tak sesuai , tukar la .

kalau tak ada boleh cari dekat sini lagipun saya rujuk tutorial dekat sini  :
aqupunyekesahbukankau.blogspot.com
biggestbeeha.blogspot.com

BACKGROUND BERWARNA

macam tadi jugak cuma yang number 4 tu tukar dengan code bawah ni .
text-decoration:none;
background: #D8D8D8;
color: #FFFFFF;
border-radius: 5px;
padding-top: 1px;padding-bottom: 1px;padding-left: 2px;padding-right: 2px;}

note :
oren - background warna
hijau - warna tulisan

 yang ni saya rujuk yang fiqahpunyacerita.blogspot.com .

10 ✿:

Raihah said...

macam ni ke nak buadmacam kat navigation tu...??

Nurhafizah said...

@Raihah Rafie bkn . ni utk underline .

Unknown said...

urm,,
saya x jumpe pon code nie

Nurhafizah said...

@Mardihah tk tgk tutorial btol2 ke ? kn dh bg twu .

Anonymous said...

thanks !

Unknown said...

thank you..
=)

Unknown said...

; Thanks :)

Fatin Nabila said...

Thankss kak , dah menjadi..:)

Aina Ayunie said...

akak, saya dah buat save semua, tapi kenapa bila saya underline, tak jadi apa-2 pun, saya dah ikut dah step akak aja,,.

Nurhafizah said...

@♛ Aina Ayunie ♛ Ade silap dkt mne2 la tu.