Büyük Başlık EM elemanı, H1 öğesinin bir alt öğesidir ve H1 üzerindeki tüm stilleri miras alınan EM metne de aktarılır. Örneğin:
h1 {font-size: 2em; } Yazı tipi boyutu özelliği devralındığı için, "Büyük" yazan (EM etiketlerinin içinde yer alan) metin H1'in geri kalanıyla aynı boyutta olacaktır. Bunun nedeni, CSS özelliğinde ayarlanan değeri miras almasıdır.
CSS Kalıtım Nasıl Kullanılır
Kullanmanın en kolay yolu, devralınmayan ve olmayan CSS özelliklerine aşina olmaktır. Özellik devralınırsa, belgedeki her alt öğe için değerin aynı kalacağını bilirsiniz.
Bunu kullanmanın en iyi yolu, temel stillerinizi BODY gibi çok üst düzey bir öğeye ayarlamaktır. Yazı tipi ailenizi gövde özelliğine ayarlarsanız, kalıtım sayesinde, tüm belge aynı yazı tipi ailesini koruyacaktır. Bu, daha az genel stil olduğundan daha kolay yönetilebilen daha küçük biçembentler yapar. Örneğin:
vücut {font-aile: Arial, sans-serif; } Stil Değerini Devral
Her CSS özelliği, "devral" değerini olası bir seçenek olarak içerir. Bu, Web tarayıcısına, özellik normal olarak devralınmasa bile, ebeveyn ile aynı değere sahip olması gerektiğini söyler. Devralınmayan bir kenar boşluğu gibi bir stil ayarlarsanız, sonraki özelliklerde üst öğeyle aynı marjı vermek için devralma değerini kullanabilirsiniz. Örneğin:
vücut {marjı: 1em; } p {margin: devralır; } Kalıtım Hesaplanmış Değerleri Kullanır
Bu, uzunlukları kullanan yazı tipi boyutları gibi devralınan değerler için önemlidir. Hesaplanan değer, Web sayfasında başka bir değere göre olan bir değerdir.
BODY öğenizin 1n'lik bir font boyutunu ayarlarsanız, sayfanızın tamamı yalnızca 1em boyutunda olmayacaktır. Bunun nedeni, başlıklar (H1-H6) ve diğer öğeler (bazı tarayıcılar tablo özelliklerini farklı şekilde hesaplar) gibi öğelerin Web tarayıcısında göreli bir boyuta sahip olmasıdır. Diğer yazı tipi boyutu bilgilerinin yokluğunda, Web tarayıcısı her zaman bir H1 başlığını sayfadaki en büyük metne, ardından H2'ye ve ardından devam ettirecektir. BODY öğenizi belirli bir yazı tipi boyutuna ayarladığınızda, bu "ortalama" yazı tipi boyutu olarak kullanılır ve başlık öğeleri bundan hesaplanır.
Kalıtım ve Geçmiş Özellikleri Hakkında Bir Not
Listelenen bir dizi stil W3C'de CSS 2'de devralınmadı, ancak Web tarayıcıları hala değerleri miras aldılar. Örneğin, aşağıdaki HTML ve CSS’yi yazdıysanız:
h1 {background-color: yellow; } Bu bir Büyük başlık Arka plan rengi özelliğinin miras alınması gerekmese bile, "Büyük" sözcüğü hala sarı bir arka plana sahip olacaktır. Bunun nedeni, bir arka plan özelliğinin başlangıç değerinin "saydam" olmasıdır. Yani, arka plan rengini üzerinde görmüyorsunuz, ancak renk ebeveynden geçiyor.