Belajar Styling Link Dalam CSS

Masih dalam Tutorial Belajar CSS, sebelumnya kita pernah Mengenal Pseudo Class  nahh untuk melakukan Styling Link Dalam CSS kita akan menggunakan Selector Pseudo Class, berikut ini adalah selector pseudo class untuk tag <a> atau link yang sering digunakan :

a:link  : Berfungsi untuk menambahkan style pada link yang belum pernah di kunjungi atau klik.

a:hover : Berfungsi untuk menambahkan style pada elemen pada saat mouse berada di atasnya.

a:active : Berfungsi untuk menambahkan style pada elemen yang sedang aktif

a:visited : Berfungsi untuk menambahkan style pada link yang sudah pernah di kunjungi

.Maka kode CSSnya adalah sebagai berikut ini.

a:link {color: green;}

a:visited {color: blue;}
a:hover {color: yellow;}
a:active {color: red;}

Silahkan sobat praktekan, buat sebuah halaman HTMl yang berisikin tag <a>, dan pasangkan kode css yang di atas.

Property Text Decoration

Property text decoration, ini berfungsi untuk memberikan dekorasi kepada link. Nilai yang bisa diberikan, yaitu none ( tanpa dekorasi) , dan underline (garis bawah). Berikut ini adalah contoh kode CSSnya.

a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: underline;}
a:active {text-decoration: underline;}

Property Background Color

Property Background Color ini berfungsi untuk memberikan warna latar belakang sebuah tulisan LINK, Nilai yang bisa diisikan juga menggunakan warna,

a:link {background-color: green;}
a:visited {background-color: blue;}
a:hover {background-color: yellow;}
a:active {background-color: red;}

Sekian mengenai tutorial Belajar Styling Link Dalam CSS, semoga tutorial ini bisa membantu dan bermanfaat untuk semuanya. Terimakasih