Belajar CSS Dasar # Pseudo Class dan Inheritance

Daftar Isi : [Tampil]

1. Pseudo Class

Digunakan untuk mendefinisikan keadaan khusus dari suatu elemen, value-nya adalah

• :link
• :hover
• :active
• :visited

a. :link

Digunakan untuk mengubah style link, default link berwarna biru dan garis bawah. Seperti Contoh :

  a:link {
    color: red;
    text-decoration: none;
  }
  

b. :hover

Digunakan untuk mengubah style ketika kursor berada diatas link. Seperti Contoh :

  a:hover {
    color: black;
    text-decoration: underline;
    text-transform: uppercase;
  }
  

b. :active

Digunakan untuk mengubah style link ketika diklik. Seperti Contoh :

  a:active {
    color: black;
    text-decoration: underline;
  }
  

b. :visited

Digunakan untuk mengubah style link ketika sudah pernah diklik. Seperti Contoh :

  a:visited {
    color: black;
    text-decoration: underline;
  }
  

Contoh Klik Disini!

2. Inheritance

Inheritance berfungsi untuk menentukan bahwa properti harus mewarisi nilainya dari elemen parent-nya. Seperti Contoh :

  body {
    font-family: arial, sans-serif;
    color: grey;
  }
  a {
    color: inherit;
  }
  

Seperti contoh diatas maka warna link tersebut akan mengikuti warna body, jika warna body diganti maka warna link tersebut pun juga akan mengikuti.

Property CSS Yang Dapat Diwariskan
color	letter-spacing	font-variant	list-style	white-spaces
text-align	font	font-weight	list-style-type	cursor
text-indent	font-family	line-height	list-style-position	direction
text-transform	font-size	border-collapse	list-style-image	caption-side
word-spacing	font-style	border-spacing	visibility	volume