Prax na kombinácie CSS selektorov
Napíšte selektor, ktorý vyberie odseky
umiestnené inside divoch div. Skontrolujte
váš selektor na nasledujúcom kóde:
<div>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<p>
+++
</p>
</div>
<p>
---
</p>
<p>
---
</p>
Napíšte selektor, ktorý vyberie všetky h2,
umiestnené inside divoch div. Skontrolujte
váš selektor na nasledujúcom kóde:
<div>
<h2>+++</h2>
<p>
---
</p>
<p>
---
</p>
</div>
<div>
<h2>+++</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
Napíšte selektor, ktorý vyberie všetky odseky
p z elementu s id, rovnym
block. Skontrolujte váš selektor na nasledujúcom
kóde:
<div id="block">
<h2>---</h2>
<p>
+++
</p>
<p>
+++
</p>
</div>
<div>
<h2>---</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
Napíšte selektor, ktorý vyberie všetky h2
z elementu s id, rovnym block.
Skontrolujte váš selektor na nasledujúcom kóde:
<div id="block">
<h2>+++</h2>
<p>
---
</p>
<p>
---
</p>
<h2>+++</h2>
<p>
---
</p>
</div>
<div>
<h2>---</h2>
<p>
---
</p>
</div>
<h2>---</h2>
<p>
---
</p>
Napíšte selektor, ktorý vyberie všetky elementy
s triedou bbb. Skontrolujte váš selektor
na nasledujúcom kóde:
<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>
Napíšte selektor, ktorý vyberie všetky elementy
s triedou bbb z elementu s id,
rovnym block. Skontrolujte váš selektor
na nasledujúcom kóde:
<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>
Napíšte selektor, ktorý vyberie všetky odseky
p s triedou bbb. Skontrolujte
váš selektor na nasledujúcom kóde:
<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>
Napíšte selektor, ktorý vyberie všetky h2
s triedou bbb. Skontrolujte váš selektor
na nasledujúcom kóde:
<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>
Napíšte selektor, ktorý vyberie všetky odseky
p s triedou bbb z elementu
s id, rovnym block. Skontrolujte
váš selektor na nasledujúcom kóde:
<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>
Napíšte selektor, ktorý vyberie všetky elementy
s triedou bbb a elementy s triedou
xxx súčasne (to znamená, že je potrebné zoskupiť
selektory cez čiarku). Skontrolujte váš selektor
na nasledujúcom kóde:
<h2 class="bbb">+++</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">+++</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
+++
</p>
<div class="bbb">
+++
</div>
Napíšte selektor, ktorý vyberie všetky odseky
p s triedou bbb a súčasne
všetky h2 s triedou xxx. Skontrolujte
váš selektor na nasledujúcom kóde:
<h2 class="bbb">---</h2>
<p class="bbb">
+++
</p>
<h2 class="xxx">+++</h2>
<p>
---
</p>
<h2>---</h2>
<p class="xxx">
---
</p>
<div class="bbb">
---
</div>
Napíšte selektor, ktorý vyberie všetky odseky
p s triedou bbb z elementu
s id, rovnym block a súčasne
všetky odseky p s triedou xxx
z elementu s id, rovnym block.
Skontrolujte váš selektor na nasledujúcom kóde:
<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>
Napíšte selektor, ktorý vyberie všetky elementy
s triedou fff. Skontrolujte váš selektor
na nasledujúcom kóde:
<div class="fff">
+++
</div>
<h2 class="fff">+++</h2>
<p class="fff">
+++
</p>
<h2 class="bbb">---</h2>
<p class="xxx">
---
</p>
Napíšte selektor, ktorý vyberie všetky odseky
p z elementu s triedou fff.
Skontrolujte váš selektor na
nasledujúcom kóde:
<div class="fff">
<h2>---</h2>
<p>
+++
</p>
<p>
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="fff">
---
</p>
Napíšte selektor, ktorý vyberie všetky odseky
p s triedou fff. Skontrolujte
váš selektor na nasledujúcom kóde:
<div id="block">
<h2>---</h2>
<p>
---
</p>
<p>
---
</p>
<p class="fff">
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="fff">
+++
</p>
Napíšte selektor, ktorý vyberie všetky elementy
s triedou bbb z elementu s triedou
fff. Skontrolujte váš selektor na nasledujúcom
kóde:
<div class="fff">
<h2 class="bbb">+++</h2>
<p>
---
</p>
<p>
---
</p>
<p class="bbb">
+++
</p>
</div>
<h2 class="fff">---</h2>
<p class="bbb">
---
</p>
Napíšte selektor, ktorý vyberie všetky h2
s triedou bbb z elementu s triedou
fff. Skontrolujte váš selektor na nasledujúcom
kóde:
<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>