CSS ընտրիչների համադրությունների պրակտիկա

Задание 1

Գրեք ընտրիչ, որը կընտրի պարագրաֆները, որոնք գտնվում են div div-ների ներսում: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div>
  <p>
    +++
  </p>
  <p>
    +++
  </p>
</div>
<div>
  <p>
    +++
  </p>
</div>

<p>
  ---
</p>
<p>
  ---
</p>

Задание 2

Գրեք ընտրիչ, որը կընտրի բոլոր h2-ները, որոնք գտնվում են div div-ների ներսում: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div>
  <h2>+++</h2>
  <p>
    ---
  </p>
  <p>
    ---
  </p>
</div>
<div>
  <h2>+++</h2>
  <p>
    ---
  </p>
</div>

<h2>---</h2>
<p>
  ---
</p>

Задание 3

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p այն տարրից, որի id-ն հավասար է block-ի: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div id="block">
  <h2>---</h2>
  <p>
    +++
  </p>
  <p>
    +++
  </p>
</div>
<div>
  <h2>---</h2>
  <p>
    ---
  </p>
</div>

<h2>---</h2>
<p>
  ---
</p>

Задание 4

Գրեք ընտրիչ, որը կընտրի բոլոր h2-ները այն տարրից, որի id-ն հավասար է block-ի: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div id="block">
  <h2>+++</h2>
  <p>
    ---
  </p>
  <p>
    ---
  </p>
  
  <h2>+++</h2>
  <p>
    ---
  </p>
</div>
<div>
  <h2>---</h2>
  <p>
    ---
  </p>
</div>

<h2>---</h2>
<p>
  ---
</p>

Задание 5

Գրեք ընտրիչ, որը կընտրի բոլոր տարրերը bbb դասով: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>

Задание 6

Գրեք ընտրիչ, որը կընտրի բոլոր տարրերը bbb դասով այն տարրից, որի id-ն հավասար է block-ի: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>

Задание 7

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p bbb դասով: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>

Задание 8

Գրեք ընտրիչ, որը կընտրի բոլոր h2-ները bbb դասով: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>

Задание 9

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p bbb դասով այն տարրից, որի id-ն հավասար է block-ի: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>

Задание 10

Գրեք ընտրիչ, որը կընտրի բոլոր տարրերը bbb դասով և տարրերը xxx դասով միաժամանակ (այսինքն պետք է խմբավորել ընտրիչները ստորակետով): Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<h2 class="bbb">+++</h2>
<p class="bbb">
  +++
</p>

<h2 class="xxx">+++</h2>
<p>
  ---
</p>

<h2>---</h2>
<p class="xxx">
  +++
</p>

<div class="bbb">
  +++
</div>

Задание 11

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p bbb դասով և միաժամանակ բոլոր h2-ները xxx դասով: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<h2 class="bbb">---</h2>
<p class="bbb">
  +++
</p>

<h2 class="xxx">+++</h2>
<p>
  ---
</p>

<h2>---</h2>
<p class="xxx">
  ---
</p>

<div class="bbb">
  ---
</div>

Задание 12

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p bbb դասով այն տարրից, որի id-ն հավասար է block-ի և միաժամանակ բոլոր պարագրաֆները p xxx դասով այն տարրից, որի id-ն հավասար է block-ի: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>

Задание 13

Գրեք ընտրիչ, որը կընտրի բոլոր տարրերը fff դասով: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div class="fff">
  +++
</div>

<h2 class="fff">+++</h2>
<p class="fff">
  +++
</p>

<h2 class="bbb">---</h2>
<p class="xxx">
  ---
</p>

Задание 14

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p այն տարրից, որի դասը fff է: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div class="fff">
  <h2>---</h2>
  <p>
    +++
  </p>
  <p>
    +++
  </p>
</div>

<h2 class="fff">---</h2>
<p class="fff">
  ---
</p>

Задание 15

Գրեք ընտրիչ, որը կընտրի բոլոր պարագրաֆները p fff դասով: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div id="block">
  <h2>---</h2>
  <p>
    ---
  </p>
  <p>
    ---
  </p>
  <p class="fff">
    +++
  </p>
</div>

<h2 class="fff">---</h2>
<p class="fff">
  +++
</p>

Задание 16

Գրեք ընտրիչ, որը կընտրի բոլոր տարրերը bbb դասով այն տարրից, որի դասը fff է: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<div class="fff">
  <h2 class="bbb">+++</h2>
  <p>
    ---
  </p>
  <p>
    ---
  </p>
  <p class="bbb">
    +++
  </p>
</div>

<h2 class="fff">---</h2>
<p class="bbb">
  ---
</p>

Задание 17

Գրեք ընտրիչ, որը կընտրի բոլոր h2-ները bbb դասով այն տարրից, որի դասը fff է: Ստուգեք ձեր ընտրիչը հետևյալ կոդի վրա.

html<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>