Evrensel seçici

CSS kursu · Başlangıç · Ders 9/82

* seçicisinin ne zaman kullanılacağını öğrenirsin.

Evrensel seçici

Evrensel seçici * işaretiyle yazılır ve sayfadaki her öğeyi yakalar — etiket ne olursa olsun. * { margin: 0; } yazarsan tüm öğelerin kenar boşluğu sıfırlanır.

Evrensel seçici güçlü ama tehlikelidir: her şeye etki eder. Genelde varsayılan kenar boşluklarını sıfırlamak veya box-sizing ayarlamak gibi dar görevlerde kullanılır.

Yaygın kullanım: sıfırlama

Evrensel seçicinin en yaygın görevi tarayıcının varsayılan kenar boşluklarını sıfırlamaktır. Tarayıcılar body, h1, p için farklı kenar boşlukları verir; * { margin: 0; } hepsini eşitler.

Benzer şekilde box-sizing: border-box her öğeye uygulandığında ölçüm daha öngörülebilir olur. Bu iki küçük ayar modern stillerin temelidir.

Uygulama Evrensel box-sizing ayarla

Evrensel seçiciyi kullanarak tüm öğeler için box-sizing: border-box tanımla. Seçici yalnızca * işareti olmalı.

Örnek çözümü göster

/* evrensel sıfırlama ekle */
* {
  box-sizing: border-box;
}

Kendini test et

Evrensel seçici hangi sembolle yazılır?
- *
- #
- .
- &
Cevabı göster

* — Doğru. * işareti evrensel seçicidir ve tüm öğeleri yakalar.

Evrensel seçiciyi yaz

____ {
  box-sizing: border-box;
  margin: 0;
}

Cevabı göster

* {
  box-sizing: border-box;
  margin: 0;
}

Seçiciyi anlamına eşle

*

Tüm öğeler
.card

Sınıfı card olanlar
#header

Kimliği header olan
p

Tüm paragraflar

Evrensel seçici