ARDS durumlarını ve rollerini CSS'de seçmen olarak kullanmama nedenleri var mı?

Question

Şu anda diğer şeylerin yanı sıra ARIA etiketlerini kullanarak erişilebilir bir site hazırlamaya çalışıyorum. Benim CSS yerine bir .error sınıfını kullanmak yerine, hedef için aria-invalid iyi seçicileri olurdu gibi grup özellikleri bu aklıma geldi. Beni CSS'den (ve JS) içine kanca için daha kolaydır

Bunun yararı yalın olan

, daha anlamlı bir HTML,. Bunun başka bir yerde yapıldığını görmedim, bu yüzden stil için erişilebilirlik etiketlerini kullanmak için olumsuzluklar olduğundan şüpheliyim. Kısıtlanmamış öznitelik seçicilerin kullanımını daha az performanslı CSS için kullandığından şüpheleniyorum, fakat daha önce düşünmediğim başka olumsuzluklar var mı?

Answer 1

Özellik seçiciler özellik seçicileri her zaman specificity of 0-0-1-0 olacaktır çünkü büyük ölçekli CSS stilleri yönetmek için çok esnek bir yoludur.

[aria-*] seçiciler, tasarım kancaları olarak kullanmak için gayet iyi ve ayrıca bir kerelik gereksinim duyabileceğiniz boşlukları doldurmak için özel [data-*] özniteliklerini kullanmanızı öneririm. Bu seçiciler

[data-foo] { 
    color: red; 
} 
[data-foo="bar"] { 
    color: blue; 
} 
[data-foo="fizz"] { 
    color: green; 
} 

Her aynı özgüllüğü vardır ve kaskad stilleri uygun biçimde uygulanmalıdır sağlayacak: Kesinlikle sınıf seçicileri ancak nitelik seçicileri ile bazı çok şık tarzı uzantılarını yapabilir, kullanılmaya devam edilmelidir.

Sen gerekirse [attr~="value"] seçici kullanarak sınıfların kendi formunu oluşturabilir.

"attribute contains" selector kullanma sınıflar üzerinde özelliklerini kullanarak gizli faydalar a technique that I call "classy images"

---

One için yararlı olabilir JavaScript performans kazancıdır. Bunun yerine (yanlış olsun oldukça kolaydır) bir elemanda bir sınıfın varlığını kontrol etmek zorunda, tarayıcılar uzun süre getAttribute, hasAttribute ve setAttribute destekledi. https://www.w3.org/TR/wai-aria-practices/#accessiblewidget, bölüm 2.7 - CSS seçicileri de ARIA etiketleri kullanma