Merhabalar, bu yazımda teorik konularımızdan biri olan CSS için Html’de Parent-Child konusuna bakacağız.
Html’de etiketler belli bir hiyerarşide yazılırlar.
Örneğin <html> etiketi Html belgesi içinde tüm etiketler için bir Parent durumundadır.
Yine Html etiketleri içinde yazılan <head> ve <body> etiketleri ise Html’in Child’larıdır. Aynı zamanda birbirleriyle de kardeştirler.
Bu bu şekilde iç içe yazabildiğimiz kadar Parent-Child-Sibling durumu yaratılarak devam eder.
CSS yazarken de belli durumlarda sadece Parent’a uygula ya da ilgili Parent’ın Child’ına uygula ya da onun Child’lardan biri Parent kabul et onun Child’larına uygula gibi seçiciler kullanarak CSS kodlarını tam olarak nereye uygulamak istersek oraya uygulayabiliriz.
Teorik olarak bu durumdan haberdar olmanız şimdilik yeterli yeri geldiğinde kodlarla olaya bakıyor olacağız.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Murat Bilginer</h1>
<div>
<div>
<p></p>
<p>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</p>
</div>
</div>
</body>
</html>Bu gördüğümüz yapıda örneğin Html içindeki bütün li etiketlerine uygulamak istemediğim sadece div > div > p > ul > li ye uygulamak istediğim bir CSS olabilir.
Burada CSS’i uyguladığımızda kimlerin bundan etkileneceğini Parent-Child olayını kavradığımızda daha rahat anlıyoruz.
Bir sonraki yazımda görüşmek üzere.
