CSS :active sahte sınıfı

Tanım ve kullanım

CSS :active Pseudo sınıflar, kullanıcı tarafından aktif hale getirilen elementlerin stillerini seçmek ve ayarlamak için kullanılır.

:active Pseudo sınıflar en sık <a> ve <button> elementi. Kullanıcı bağlantıyı tıkladığında, bağlantı aktif hale gelir; düğme de aynı şekilde davranır.

İpucu:Kullanın :link Ziyaret edilmemiş sayfanın bağlantı stillerini ayarlamak için kullanın :visited Ziyaret edilmiş sayfanın bağlantı stillerini ayarlamak için kullanın :hover Fare ile üzerine gelinen bağlantı stillerini ayarlayın.

Dikkat:CSS tanımlarında,:active Bu, :hoverVarsa, etkili hale gelmeden önce!

Örnek

Örnek 1

Aktif bağlantı stillerini seçin ve ayarlayın:

a:active {
  background-color: yellow;
}

Kişisel olarak deneyin

Örnek 2

Kullanıcının tıkladığında <button> stillerini seçin ve ayarlayın:

button:active {
  background-color: pink;
}

Kişisel olarak deneyin

Örnek 3

Ziyaret edilmiş <p>、<h1> ve <a> elementlerinin stillerini seçin ve ayarlayın:

p:active, h1:active, a:active {
  background-color: yellow;
}

Kişisel olarak deneyin

Örnek 4

Ziyaret edilmemiş, ziyaret edilmiş, üzerine gelinen ve aktif bağlantı stillerini seçin ve ayarlayın:

/* Ziyaret edilmemiş bağlantı */
a:link {
  color: green;
}
/* Ziyaret edilmiş bağlantı */
a:visited {
  color: green;
}
/* Fare ile üzerine gelinen bağlantı */
a:hover {
  color: red;
}
/* Aktif bağlantı */
a:active {
  color: yellow;
}

Kişisel olarak deneyin

Örnek 5

Bağlantılara farklı stiller uygulayın:

a.ex1:hover, a.ex1:active {
  color: red;
}
a.ex2:hover, a.ex2:active {
  font-size: 150%;
}

Kişisel olarak deneyin

CSS Dilbilgisi

:active {
  css declarations;
}

Teknik ayrıntılar

Tarayıcı desteği

Tabloda belirtilen rakamlar, bu pseudo sınıfın tam olarak desteklenen ilk tarayıcı sürümünü belirtir.

İlgili sayfalar

Rehber:CSS Bağlantısı

Rehber:CSS Düğmesi

Rehber:CSS Pseudo Sınıfları