# Тег div для группировки тегов

В предыдущем уроке мы с вами разобрали тег `span`, который позволяет как-то выделить кусочек текста. Существует также специальный тег `div`, который позволяет сгруппировать несколько тегов, чтобы затем сними сделать что-нибудь одновременно.

Пусть для примера с помощью тегов `div` мы сгруппируем абзацы:

`<div class="block1"> <p> текст </p> <p> текст </p> </div> <div class="block2"> <p> текст </p> <p> текст </p> </div>`

Давайте элементам из первой группы назначим красный цвет, а элементам из второй группы - зеленый:

`.block1 { color: red; } .block2 { color: green; }`

Дан следующий код:

`<div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> </div> <div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> <p> текст </p> </div> <div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> <p> текст </p> <p> текст </p> </div>`

Покрасьте содержимое первого дива в красный цвет, содержимое второго дива - в зеленый, а содержимое третьего дива - с голубой. Задайте для этого каждому диву свой класс.

Дан следующий код:

`<div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> </div> <div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> </div> <div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> </div> <div> <h2>заголовок</h2> <p> текст </p> <p> текст </p> </div>`

Покрасьте содержимое первого и третьего дива в красный цвет, содержимое второго дива и четвертого - в зеленый. Для этого первому и третьему дивам дайте один класс, а второму и четвертому - другой класс.

←→
↑