CSS-də pseudoklasslar nədir?

CSS-də pseudo-siniflər, elementin xüsusi vəziyyətini göstərmək üçün seçicilərə əlavə olunan açar sözlərdir. Onlar istifadəçi ilə qarşılıqlı əlaqəyə, sənədin quruluşundakı mövqeyinə və ya digər xüsusiyyətlərə əsasən üslubları tətbiq etməyə imkan verir və bu xüsusiyyətlər standart seçicilərlə ifadə edilə bilməz.

Pseudo-sinif nümunələri:

• İstifadəçi vəziyyətləri:

  • :hover - maus ilə üzərinə gəlinən element.
  • :active - aktivləşdirilən element (məsələn, kliklənmiş düymə).
  • :focus - giriş fokusunda olan element (məsələn, mətn sahəsi).
  • :visited - istifadəçinin artıq ziyarət etdiyi link.
  • :link - istifadəçinin hələ ziyarət etmədiyi link.

• Quruluşdakı mövqe:

  • :first-child - valideynin ilk uşağı.
  • :last-child - valideynin son uşağı.
  • :nth-child(n) - n-ci uşağı.
  • :first-of-type - növünə görə ilk element.
  • :last-of-type - növünə görə son element.

• Digər:

  • :empty - uşaqları və ya mətn olmayan element.
  • :not(selector) - göstərilən seçiciyə uyğun olmayan elementlər.

Sintaksis:

selector:pseudo-class {
  property: value;
}

İstifadə nümunəsi:

/* Paraqraf üzərinə gəlinəndə mətnin rəngini dəyişdir */
p:hover {
  color: blue;
}

/* Siyahının ilk elementinə stil ver */
li:first-child {
  font-weight: bold;
}

Pseudo-siniflər seçicilərin imkanlarını genişləndirir, sadə stil dəyişiklikləri üçün JavaScript istifadə etmədən daha dinamik və interaktiv interfeyslər yaratmağa imkan verir.