Web sitelerini nasıl kodlayacağınızı öğrenmenin en iyi yollarından biri, web sitelerine bakmaktır. kaynak kodları diğer sitelerden. Bu uygulama, özellikle çok fazla seçeneğin olmadığı günlerde, birçok web profesyonelinin zanaatını öğrendiğidir. web tasarımı kurslar, kitaplar ve çevrimiçi eğitim siteleri.
Bu uygulamayı denerseniz ve bir sitenin basamaklı stil sayfalarına bakarsanız, o kodda görebileceğiniz tek şey şu satırdır: !önemli. Bu terim, stil sayfasındaki işleme önceliğini değiştirir.
CSS Çağlayanı
Basamaklı stil sayfaları gerçekten Çağlayan, belirli bir sıraya göre yerleştirildikleri anlamına gelir. Genel olarak stiller, tarayıcı tarafından okundukları sırayla uygulanır. İlk stil uygulanır ve ardından ikincisi vb.
Sonuç olarak, bir stil, bir stil sayfasının en üstünde belirir ve ardından belgenin alt kısımlarında değiştirilirse, bu stilin ikinci örneği, ilk değil, sonraki örneklerde uygulanandır. Temel olarak, iki stil aynı şeyi söylüyorsa (bu, aynı düzeyde özgüllüğe sahip oldukları anlamına gelir), listelenen sonuncusu kullanılacaktır.
Örneğin, aşağıdaki stillerin bir stil sayfasında yer aldığını düşünelim. Uygulanan ilk stil özelliği kırmızı olsa bile paragraf metni siyah olarak işlenecektir. Bunun nedeni, "siyah" değerin ikinci sırada listelenmesidir. CSS yukarıdan aşağıya okunduğundan, son stil "siyah" olur ve bu nedenle bu kazanır.
p { renk: kırmızı; }
p { renk: siyah; }
!important Önceliği Nasıl Değiştirir?
!önemli yönergesi, CSS'nizin en önemli olduğunu ve uygulanması gerektiğini düşündüğünüz kuralları takip ederken nasıl basamaklandırıldığını etkiler. Bu yönergeye sahip bir kural, bu kuralın CSS belgesinde nerede göründüğüne bakılmaksızın her zaman uygulanır.
Paragraf metnini her zaman kırmızı yapmak için önceki örnekte olduğu gibi stili aşağıdaki gibi değiştirin:
p { renk: kırmızı !önemli; }
p { renk: siyah; }
Şimdi, "siyah" değer ikinci sırada yer almasına rağmen, tüm metin kırmızı renkte görünecektir. !important yönergesi, çağlayanın normal kurallarını geçersiz kılar ve bu stile çok yüksek bir özgüllük verir.
Paragrafların kesinlikle kırmızı görünmesi gerekiyorsa, bu stil bunu yapar, ancak bu, bunun iyi bir uygulama olduğu anlamına gelmez.
Ne Zaman Kullanılır !important
!important yönergesi, bir web sitesini test ederken ve hata ayıklarken yardımcı olur. Bir stilin neden uygulanmadığından emin değilseniz ve bunun bir özgüllük çakışması olabileceğini düşünüyorsanız, !important bildirimini düzeltip düzeltmediğini görmek için stil — ve düzeltirse, seçicilerin sırasını değiştirin ve üretiminizden !important yönergelerini kaldırın. kod.
İstediğiniz stilleri elde etmek için !important bildirimine çok fazla yaslanırsanız, sonunda !important stilleriyle dolu bir stil sayfanız olur. Bu sayfanın CSS'sinin işlenme şeklini temelden değiştireceksiniz. Uzun vadeli bir yönetim açısından iyi olmayan tembel bir uygulamadır.
Test için veya bazı durumlarda, bir temanın veya şablon çerçevesinin parçası olan bir satır içi stili kesinlikle geçersiz kılmanız gerektiğinde !important kullanın. Bu durumlarda bile, bu yaklaşımı idareli kullanın ve onun yerine temiz stil sayfaları yazın. Çağlayan.
Kullanıcı Stil Sayfaları
Bu yönerge ayrıca, web sayfası kullanıcılarının, sayfaları kullanmalarını veya okumalarını zorlaştıran stil sayfalarıyla başa çıkmalarına yardımcı olmak için uygulamaya konmuştur.
Ne zaman birisi bir stil sayfası tanımlar web sayfalarını görüntülemek için, bu stil sayfası, sayfa yazarının stil sayfası tarafından geçersiz kılınır. Kullanıcı bir stili !important olarak işaretlerse, yazar bir kuralı !important olarak işaretlese bile bu stil web sayfası yazarının stil sayfasını geçersiz kılar.
Bu hiyerarşi, stilleri belirli bir şekilde ayarlaması gereken kullanıcılar için yararlıdır. Örneğin, görme engelli bir okuyucu, kullandığı tüm web sayfalarında varsayılan yazı tipi boyutlarını artırma ihtiyacı duyabilir. Oluşturduğunuz sayfalarda !important yönergenizi tutumlu bir şekilde kullanarak, okuyucularınızın benzersiz ihtiyaçlarını karşılarsınız.