Thursday, 14 May 2015

Cara mengatur LINK di CSS

Turmudi

        LINK  atau HYPERLINK  adalah sebuah acuan dalam dukumen hypertext ke dukumen lain atau ke sumber lain. Nah, untuk itu anda bisa dapat menata dengan cara yang berbeda.

Link Styling
Link dapat ditata dengan properti CSS misalnya ,warna, font, atau latar belakang.





Contoh

a {
    color: #FF0000;
}


Selain itu, link tersebut dapat ditata berbeda, seperti Empat link dibawah ini :
  • a: link      - normal, link yang belum dikunjungi
  • a: visited  - link pengguna telah mengunjungi
  • a: hover   - link  ketika mouse pengguna di atasnya
  • a: aktif     - link saat itu di klik


CONTOH :

/* unvisited link */
a:link {
    color: #FF0000;
}

/* visited link */
a:visited {
    color: #00FF00;
}

/* mouse over link */
a:hover {
    color: #FF00FF;
}

/* selected link */
a:active {
    color: #0000FF;
}

Dekorasi Teks
Properti teks dekorasi sangat banyak digunakan untuk menghilangkan garis bawah dari link :
CONTOH

 a:link {
    text-decoration: none;
}

a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a:active {
    text-decoration: underline;
}

Warna Latar Belakang 
Properti background color atau warna latar belakang untuk link :
CONTOH
 a:link {
    background-color: #B2FF99;
}

a:visited {
    background-color: #FFFF85;
}

a:hover {
    background-color: #FF704D;
}

a:active {
    background-color: #FF704D;
}

Demikian......

Semoga Bermanfaat.......

Salam U-DT 

0 comments:

Post a Comment