Thursday, April 16, 2009

BASIC MEMBUAT TEMPLATES BLOG BAGIAN 5

LINK


Kali ini kita akan sama-sama belajar yang agak sederhana dulu, yaitu cara menghilangkan garis bawah pada "LINK" dan "LINK ACTIVE"... Mungkin ada sebagian dari Anda ada yang kurang suka atau bahkan tidak suka bila link-nya ada tambahan garis bawah, seperti contoh gambar ini:

TEXT
Nah untuk menghilangkan-nya... Masuk ke menu layout --> edit html --> dan cari script css berikut :

/* links */

a:link {
color: $linkcolor
text-decoration: italic
}

a:visited {
color: $visitedlinkcolor
text-decoration: italic
}

a:hover {
color: #5B739C
text-decoration: italic
}

a:active {
color: #5B739C
text-decoration: italic
}

Tulisan yang saya beri warna merah itu-lah yang harus diganti menjadi seperti ini :

/* links */

a:link {
color: $linkcolor
text-decoration: none
}

a:visited {
color: $visitedlinkcolor
text-decoration: none
}

a:hover {
color: #5B739C
text-decoration: none
}

a:active {
color: #5B739C
text-decoration: none
}

Nah... Coba sekarang dilihat lagi... hasil-nya akan seperti ini :

DECORATION
Nah kalau ternyata script templates Anda tidak ada tambahan text decoration seperti ini :

/* links */

a:link {
color: $linkcolor
}

a:visited {
color: $visitedlinkcolor
}

a:hover {
color: #5B739C
}

a:active {
color: #5B739C
}

Script di atas tidak ada perintah "TEXT-DECORATION"-nya... Maka default-nya link akan digaris bawahi... Kalau tidak mau digaris bawahi, tambahkan perintah "TEXT-DECORATION:NONE" di setiap CSS-nya (sama seperti contoh script yang nomor dua (2) dari atas...


Semoga bermanfaat...

Related Posts by Categories



Bookmark and Share

1 comments:

Mr. PKM said...

wah mantap mas tutorialnya.