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

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

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

<div class="block1">
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div class="block2">
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

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

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

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

<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

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

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

<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Title</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

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