Örneğimizde idsi Burak olan bir divimiz olacak ve buna dosyamızda bulunan css kodu, sayfamızda bulunan css kodu ve tagin içinde bulunan style tarafından müdahale etmeye çalışarak hangisinin daha öncelikli çalışacağını göreceğiz.
İlk olarak bir stylesheet oluşturalım ve içine idsi Burak tagler için geçerli olacak css kodumuzu yazalım.
Sayfamızdaki kodumuz şu şekilde.
Gelelim ekran görüntüsüne.
Peki hem dosyada hemde sayfada idsi Burak olan div için css kodu bulunsa ne olacaktı? Bunu görebilmek için sayfamıza birde css kodu ekleyelim.
Şu anda idsi Burak olan div için hem dosyamızda hemde sayfamızda css kodumuz var. Peki hangisi çalışacak?
Gördüğünüz gibi dosyamızdaki css kodu değil sayfamızdaki css kodu çalıştı. İşte burada hiyerarşi konusuna girmiş olduk. Eğer hem dosyada hemde sayfada css kodu varsa sayfanızda görüntülenecek sayfanızdaki css kodudur.
Peki div içine style attribute ile css kodu ekleseydik ne olacaktı? Burada da divin içindeki style attribute'u görüntülenecektir.
Sonuç olarak dosyamızda , sayfamızda ve tagin içerisinde css kodları mevcutsa;
Tag'in içindeki style (Yoksa) -> Sayfadaki css kodu(Yoksa) -> Dosyadaki css kodu görüntülenecektir.
Umarım faydalı bir yazı olmuştur.
Hiç yorum yok:
Yorum Gönder