Таг 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 в червен цвят, съдържанието на втория div - в зелен, а съдържанието на третия div - в син. Задайте за това на всеки 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>

Оцветете съдържанието на първия и третия div в червен цвят, съдържанието на втория и четвъртия - в зелен. За това на първия и третия div дайте един клас, а на втория и четвъртия - друг клас.