CSS селекторлар комбинациялари амалиёти

Задание 1

Дивлар div ичида жойлашган абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

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

Задание 2

Дивлар div ичида жойлашган барча h2 ларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

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

Задание 3

id си block га тенг бўлган элементдан барча p абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

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

Задание 4

id си block га тенг бўлган элементдан барча h2 ларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

id си block га тенг бўлган элементдан 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>

Задание 7

bbb синфига эга барча p абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

bbb синфига эга барча h2 ларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

id си block га тенг бўлган элементдан bbb синфига эга барча p абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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 синфига эга барча элементларни бир вақтда танлайдиган селектор ёзинг (яъни селекторларни vergul орқали гуруҳлаш керак). Сизнинг селекторингизни куйидаги кодда текширинг:

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

bbb синфига эга барча p абзацлар ва бир вақтда xxx синфига эга барча h2 ларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

id си block га тенг бўлган элементдан bbb синфига эга барча p абзацлар ва бир вақтда id си block га тенг бўлган элементдан xxx синфига эга барча p абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

fff синфига эга элементдан барча p абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

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

Задание 15

fff синфига эга барча p абзацларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

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

Задание 16

fff синфига эга элементдан bbb синфига эга барча элементларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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

fff синфига эга элементдан bbb синфига эга барча h2 ларни танлайдиган селектор ёзинг. Сизнинг селекторингизни куйидаги кодда текширинг:

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>