CSS özgüllük hesaplayıcısı
CSS seçicilerin özgüllüğünü hesapla ve hangisinin kazandığını gör.
CSS özgüllük hesaplayıcısı
Bir veya daha fazla CSS seçiciyi yapıştırın, her biri ayrı bir satırda, ve bu araç her seçicinin özgüllüğünü standart üç bölümlü puan olarak hesaplar: ID'ler, sınıflar (artı öznitelikler ve sözde sınıflar) ve öğeler (artı sözde öğeler). Özgüllük, tarayıcının çakışan hangi kuralı uyguladığını belirler, bu nedenle iki stil kuralı aynı öğeyi hedeflediğinde ve hangisinin kazandığını bilmek istediğinizde veya bir geçersiz kılmanın neden çalışmadığını hata ayıkladığınızda yararlıdır.
Vesszülle ayrılmış listeleri böl seçeneğini açın, böylece ".a, .b" gibi bir listedeki her seçiciyi ayrı satırda puanlandırabilirsiniz. En güçlü olanın başında sırala seçeneği sonuçları en yüksekten en düşüğe özgüllüğe göre yeniden sıralar. Tablo seçeneğini, ID'lerin, sınıfların ve öğelerin sütunlara ayrılmış bir düzeni için veya 0-1-2 gösterimini seçicibaşına "1-0-2" gibi kompakt bir puan için seçin. Ayrıntılı açıklamayı göster seçeneği, her seçicinin hangi bölümünün — bir ID, bir sınıf, bir öğe — puanlamaya katkı sağladığını listeler; bu, bir kuralın diğerini neden geçersiz kıldığını tam olarak görmek için en hızlı yoldur.
Hesaplayıcı, zor durumlar için CSS Selectors spesifikasyonunu takip eder: :where() içinde ne olursa olsun her zaman sıfır puanı alırken, :is(), :not() ve :has() en özel argümanlarının özgüllüğünü üstlenir. !important içeren bir seçici işaretlenir, çünkü özgüllüğden bağımsız olarak normal kaskadı geçersiz kılar ve seçicinin kendi puanının parçası olmasa bile bunu bilmek değerlidir. Windows ve Unix satır sonları aynı şekilde işlenir ve boş satırlar yoksayılır.
Her şey tarayıcınızda yerel olarak çalışır — yapıştırdığınız seçiciler hiçbir yere yüklenmez, bu da özel bir kod tabanına karşı kontrol ederken önemlidir. Sonucu kopyalayın, .txt dosyası olarak indirin veya seçicilerinizi iyileştirmeye devam etmek için çıktıyı girişe gönderin.