CSS Seçici Kombinasyonları Üzerine Pratik
div'ların içinde bulunan paragrafları seçecek
bir seçici yazın. Seçicinizi aşağıdaki kod üzerinde
test edin:
<div>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<p>
+++
</p>
</div>
<p>
---
</p>
<p>
---
</p>
div'ların içinde bulunan tüm h2'leri
seçecek bir seçici yazın. Seçicinizi aşağıdaki kod
üzerinde test edin:
<div>
<h2>+++</h2>
<p>
---
</p>
<p>
---
</p>
</div>
<div>
<h2>+++</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
id'si block olan elementin içindeki
tüm p paragraflarını seçecek bir seçici yazın.
Seçicinizi aşağıdaki kod üzerinde test edin:
<div id="block">
<h2>---</h2>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<h2>---</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
id'si block olan elementin içindeki
tüm h2'leri seçecek bir seçici yazın.
Seçicinizi aşağıdaki kod üzerinde test edin:
<div id="block">
<h2>+++</h2>
<p>
---
</p>
<p>
---
</p>
<h2>+++</h2>
<p>
---
</p>
</div>
<div>
<h2>---</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
bbb sınıfına sahip tüm elementleri seçecek
bir seçici yazın. Seçicinizi aşağıdaki kod üzerinde
test edin:
<div id="block">
<h2 class="bbb">+++</h2>
<p class="bbb">
+++
</p>
<p>
---
</p>
<h2 class="bbb">+++</h2>
<p>
---
</p>
</div>
<div class="bbb">
+++
</div>
<h2>---</h2>
<p class="bbb">
+++
</p>
id'si block olan elementin içindeki
bbb sınıfına sahip tüm elementleri seçecek
bir seçici yazın. Seçicinizi aşağıdaki kod üzerinde
test edin:
<div id="block">
<h2 class="bbb">+++</h2>
<p class="bbb">
+++
</p>
<p>
---
</p>
<h2 class="bbb">+++</h2>
<p>
---
</p>
</div>
<div class="bbb">
---
</div>
<h2>---</h2>
<p class="bbb">
---
</p>
bbb sınıfına sahip tüm p paragraflarını
seçecek bir seçici yazın. Seçicinizi aşağıdaki kod
üzerinde test edin:
<div id="block">
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
<p>
---
</p>
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
</div>
<div class="bbb">
---
</div>
<h2>---</h2>
<p class="bbb">
+++
</p>
bbb sınıfına sahip tüm h2'leri seçecek
bir seçici yazın. Seçicinizi aşağıdaki kod üzerinde
test edin:
<div id="block">
<h2 class="bbb">+++</h2>
<p class="bbb">
---
</p>
<p>
---
</p>
<h2 class="bbb">+++</h2>
<p class="bbb">
---
</p>
</div>
<h2>---</h2>
<p class="bbb">
---
</p>
<h2 class="bbb">+++</h2>
<p class="bbb">
---
</p>
id'si block olan elementin içindeki
bbb sınıfına sahip tüm p paragraflarını
seçecek bir seçici yazın. Seçicinizi aşağıdaki kod
üzerinde test edin:
<div id="block">
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
<p>
---
</p>
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
</div>
<div class="bbb">
---
</div>
<h2>---</h2>
<p class="bbb">
---
</p>
bbb sınıfına sahip tüm elementleri VE
xxx sınıfına sahip tüm elementleri aynı anda
seçecek bir seçici yazın (yani seçicileri virgülle
gruplandırmanız gerekiyor). Seçicinizi aşağıdaki kod
üzerinde test edin:
<h2 class="bbb">+++</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">+++</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
+++
</p>
<div class="bbb">
+++
</div>
bbb sınıfına sahip tüm p paragraflarını
VE aynı anda xxx sınıfına sahip tüm h2'leri
seçecek bir seçici yazın. Seçicinizi aşağıdaki kod
üzerinde test edin:
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">+++</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
---
</p>
<div class="bbb">
---
</div>
id'si block olan elementin içindeki
bbb sınıfına sahip tüm p paragraflarını
VE aynı anda id'si block olan elementin
içindeki xxx sınıfına sahip tüm p
paragraflarını seçecek bir seçici yazın. Seçicinizi
aşağıdaki kod üzerinde test edin:
<div id="block">
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">---</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
+++
</p>
<div class="bbb">
---
</div>
<div class="xxx">
---
</div>
</div>
<h2 class="bbb">---</h2>
<p class="xxx">
---
</p>
fff sınıfına sahip tüm elementleri seçecek
bir seçici yazın. Seçicinizi aşağıdaki kod üzerinde
test edin:
<div class="fff">
+++
</div>
<h2 class="fff">+++</h2>
<p class="fff">
+++
</p>
<h2 class="bbb">---</h2>
<p class="xxx">
---
</p>
fff sınıfına sahip elementin içindeki tüm
p paragraflarını seçecek bir seçici yazın.
Seçicinizi aşağıdaki kod üzerinde test edin:
<div class="fff">
<h2>---</h2>
<p>
+++
</p>
<p>
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="fff">
---
</p>
fff sınıfına sahip tüm p paragraflarını
seçecek bir seçici yazın. Seçicinizi aşağıdaki kod
üzerinde test edin:
<div id="block">
<h2>---</h2>
<p>
---
</p>
<p>
---
</p>
<p class="fff">
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="fff">
+++
</p>
fff sınıfına sahip elementin içindeki
bbb sınıfına sahip tüm elementleri seçecek
bir seçici yazın. Seçicinizi aşağıdaki kod üzerinde
test edin:
<div class="fff">
<h2 class="bbb">+++</h2>
<p>
---
</p>
<p>
---
</p>
<p class="bbb">
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="bbb">
---
</p>
fff sınıfına sahip elementin içindeki
bbb sınıfına sahip tüm h2'leri
seçecek bir seçici yazın. Seçicinizi aşağıdaki kod
üzerinde test edin:
<div class="fff">
<h2 class="bbb">+++</h2>
<p>
---
</p>
<h2 class="bbb">+++</h2>
<p>
---
</p>
<p class="bbb">
---
</p>
</div>
<h2 class="bbb">---</h2>
<p class="bbb">
---
</p>
<p class="fff">
---
</p>
