CSS selektorite kombinatsioonide harjutus
Kirjutage selektor, mis valib lõigud,
mis asuvad div elementide div sees. Kontrollige
oma selektorit järgneva koodiga:
<div>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<p>
+++
</p>
</div>
<p>
---
</p>
<p>
---
</p>
Kirjutage selektor, mis valib kõik h2
elemendid, mis asuvad div elementide div sees. Kontrollige
oma selektorit järgneva koodiga:
<div>
<h2>+++</h2>
<p>
---
</p>
<p>
---
</p>
</div>
<div>
<h2>+++</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
Kirjutage selektor, mis valib kõik lõigud
p elemendist, mille id on
võrdne block-ga. Kontrollige oma selektorit järgneva
koodiga:
<div id="block">
<h2>---</h2>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<h2>---</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
Kirjutage selektor, mis valib kõik h2
elemendid elemendist, mille id on võrdne block-ga.
Kontrollige oma selektorit järgneva koodiga:
<div id="block">
<h2>+++</h2>
<p>
---
</p>
<p>
---
</p>
<h2>+++</h2>
<p>
---
</p>
</div>
<div>
<h2>---</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
Kirjutage selektor, mis valib kõik elemendid
klassiga bbb. Kontrollige oma selektorit
järgneva koodiga:
<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>
Kirjutage selektor, mis valib kõik elemendid
klassiga bbb elemendist, mille id
on võrdne block-ga. Kontrollige oma selektorit
järgneva koodiga:
<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>
Kirjutage selektor, mis valib kõik lõigud
p klassiga bbb. Kontrollige
oma selektorit järgneva koodiga:
<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>
Kirjutage selektor, mis valib kõik h2
elemendid klassiga bbb. Kontrollige oma selektorit
järgneva koodiga:
<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>
Kirjutage selektor, mis valib kõik lõigud
p klassiga bbb elemendist
mille id on võrdne block-ga. Kontrollige
oma selektorit järgneva koodiga:
<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>
Kirjutage selektor, mis valib kõik elemendid
klassiga bbb ja elemendid klassiga
xxx üheaegselt (st peate grupeerima
selektorid komaga). Kontrollige oma selektorit
järgneva koodiga:
<h2 class="bbb">+++</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">+++</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
+++
</p>
<div class="bbb">
+++
</div>
Kirjutage selektor, mis valib kõik lõigud
p klassiga bbb ja üheaegselt
kõik h2 elemendid klassiga xxx. Kontrollige
oma selektorit järgneva koodiga:
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">+++</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
---
</p>
<div class="bbb">
---
</div>
Kirjutage selektor, mis valib kõik lõigud
p klassiga bbb elemendist
mille id on võrdne block-ga ja üheaegselt
kõik lõigud p klassiga xxx
elemendist mille id on võrdne block-ga.
Kontrollige oma selektorit järgneva koodiga:
<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>
Kirjutage selektor, mis valib kõik elemendid
klassiga fff. Kontrollige oma selektorit
järgneva koodiga:
<div class="fff">
+++
</div>
<h2 class="fff">+++</h2>
<p class="fff">
+++
</p>
<h2 class="bbb">---</h2>
<p class="xxx">
---
</p>
Kirjutage selektor, mis valib kõik lõigud
p elemendist klassiga fff.
Kontrollige oma selektorit
järgneva koodiga:
<div class="fff">
<h2>---</h2>
<p>
+++
</p>
<p>
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="fff">
---
</p>
Kirjutage selektor, mis valib kõik lõigud
p klassiga fff. Kontrollige
oma selektorit järgneva koodiga:
<div id="block">
<h2>---</h2>
<p>
---
</p>
<p>
---
</p>
<p class="fff">
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="fff">
+++
</p>
Kirjutage selektor, mis valib kõik elemendid
klassiga bbb elemendist klassiga
fff. Kontrollige oma selektorit järgneva
koodiga:
<div class="fff">
<h2 class="bbb">+++</h2>
<p>
---
</p>
<p>
---
</p>
<p class="bbb">
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="bbb">
---
</p>
Kirjutage selektor, mis valib kõik h2
elemendid klassiga bbb elemendist klassiga
fff. Kontrollige oma selektorit järgneva
koodiga:
<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>