Basamaklı Stil Sayfalarında Cascade Nedir?

CSS Kısa Dersi

Kaskat, CSS stil sayfalarını bu kadar kullanışlı kılan şeydir. Kısacası, kaskat çatışan stillerin nasıl uygulanacağı konusundaki öncelik sırasını tanımlar. Başka bir deyişle, iki tarzınız varsa:

p {color: kırmızı; }
p {color: mavi; }

Basamak, paragrafların hem kırmızı hem de mavi olması gerektiğini belirtmesine rağmen, paragrafların hangi renkte olması gerektiğini belirler. Sonuç olarak, paragraflara yalnızca bir renk uygulanabilir, bu yüzden bir sipariş olması gerekir.

Ve bu sıra, hangi seçmenlerin (yukarıdaki örnekte yer alan p) en yüksek önceliğe ve belgede görüntülenen sıraya göre uygulandığıyla uygulanır.

Aşağıdaki liste, tarayıcınızın bir stil için önceliğe nasıl karar verdiğinin basitleştirilmesidir:

  1. Elemana uyan bir seçici için stil sayfasına bakın. Tanımlanmış stiller yoksa, tarayıcıda varsayılan kuralları kullanın.
  2. Önemli işaretli seçmenler için stil sayfasına bakın ve bunları uygun elemanlara uygulayın.
  3. Stil sayfasındaki tüm stiller, varsayılan tarayıcı stillerini geçersiz kılar (kullanıcı stil sayfaları hariç).
  4. Stil seçici ne kadar spesifikse, sahip olacağı öncelik o kadar yüksek olur. Örneğin, div> p.class, p'den daha spesifik olan p.class'dan daha spesifiktir.
  5. Son olarak, aynı öğe için iki kural geçerliyse ve aynı seçicinin önceliğine sahipse, en son yüklenen dosya uygulanacaktır. Başka bir deyişle, stil sayfası yukarıdan aşağıya doğru okunur ve stiller birbirinin üzerine uygulanır.

Bu kurallara dayanarak, yukarıdaki örnekte paragraflar mavi olarak yazılır, çünkü p {color: blue; } stil sayfasında son gelir.

Bu, çağlayanın çok basitleştirilmiş bir açıklamasıdır. Kaskadın nasıl çalıştığı hakkında daha fazla bilgi edinmek istiyorsanız , Basamaklı Stil Sayfalarında “Kaskad” kelimesinin ne anlama geldiğini okumalısınız. .