CSS'de Link Özellikleri

CSS ile, linkler farklı şekillerde şekillendirilebilir.CSS'de linkler, herhangi bir CSS özelliğiyle (ör. color, font-family, background vb.) biçimlendirilebilir.

a {
  color: red;
}

Ek olarak, hangi durumda olduklarına bağlı olarak linkler farklı şekilde şekillendirilebilir. 4 farklı link durumu vardır :

  • a:link - normal, ziyaret edilmemiş bir link
  • a:visited- kullanıcının ziyaret ettiği link
  • a:hover - kullanıcının fareyle üzerine geldiğinde bir link
  • a:active - tıklandığı anda bir link. 
/* ziyaret edilmemiş link */
a:link {
  color: red;
}

/* ziyaret edilmiş link */
a:visited {
  color: green;
}

/* fare üstüne gelinmiş link */
a:hover {
  color: hotpink;
}

/* tıklanılmış link */
a:active {
  color: blue;
}

# Linkler : text-decoration

CSS'de text-decoration özelliği çoğunlukla linklerde alt çizgileri kaldırmak için kullanılır:

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

a:active {
  text-decoration: underline;
}

Linkler : background-color

CSS'de background-color özelliği, linkler için bir arka plan rengi belirtmek için kullanılabilir:

a:link {
  background-color: yellow;
}

a:visited {
  background-color: cyan;
}

a:hover {
  background-color: lightgreen;
}

a:active {
  background-color: hotpink;
}

Sorular (0)