CSSSeçiciler1 dk okuma

CSS Seçicilerinde Ustalaşın

Bir seçici, tarayıcıya bir stilin hangi öğeler için olduğunu söyler. p ve .class'tan :has() ve :not()'a kadar yaygın her türü, yazarak ve neyi seçtiklerini izleyerek öğrenin.

Deneyin
<div class="card">
<h2 class="title">Weekend trip</h2>
<p>Pack light.</p>
<p class="note">Bring a jacket.</p>
<ul>
<li>Tent</li>
<li class="done">Map</li>
<li>Snacks</li>
</ul>
<button id="go">Let's go</button>
</div>

Hiçbir öğe eşleşmiyor.

Kursa başlaTarayıcınızda 38 kısa adım

Neler öğreneceksiniz

  1. 01

    Temeller

    • Evrensel seçici
    • Tür seçicileri
    • Sınıf seçicileri
    • ID seçicileri
    • Birden fazla seçici
    • Alıştırma: 5 soru
  2. 02

    İlişkiler

    • Alt öğe seçicileri
    • Doğrudan alt öğe seçicileri
    • Bitişik kardeş seçicileri
    • Genel kardeş seçicileri
  3. 03

    Öznitelikler

    • Öznitelik seçicileri: var mı, eşit mi, ile başlıyor mu, ile bitiyor mu, içeriyor mu, kelime olarak içeriyor mu
    • Alıştırma: 5 soru
  4. 04

    Konum ve mantık

    • :first-child ve :last-child
    • :nth-child(): bir sayı, tek ve çift
    • :has()
    • :not()

Önizleme

Sık sorulan sorular

Bu kurs kimler için?

CSS yazan ya da okuyan herkes için: front-end ve back-end geliştiriciler, QA mühendisleri ve tasarımcılar. Aynı seçiciler test otomasyonunda, web scraping'de ve JavaScript'te querySelector ile de kullanılır.

Önceden bilgi sahibi olmam gerekiyor mu?

Hayır. Kurs en basit seçiciyle başlar; deneyimli geliştiriciler ilk adımları hızlıca geçebilir.

Ne kadar sürüyor?

Kurs, kendi hızınızda ilerlediğiniz kısa adımlardan oluşur. Çoğu kişi 30 dakika ile bir saat arasında bitirir.

Nasıl çalışıyor?

Her adım küçük bir HTML parçası ve bir görev gösterir. Bir seçici yazarsınız, seçtiği öğeler anında yanar ve hedefle eşleştiğinde bir sonraki adıma geçersiniz. Ezberleyerek değil, deneyerek öğrenirsiniz.

Kursa başla

Destekçiler arasına katılın