Tag div pro skupinu tagů v HTML

V předchozí lekci jsme probrali tag span, který umožňuje nějak zvýraznit část textu. Existuje také speciální tag div, který umožňuje seskupit několik tagů, aby se s nimi pak dalo najednou něco udělat.

Nechť například pomocí tagů div seskupíme odstavce:

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

Nastavme prvkům z první skupiny červenou barvu, a prvkům z druhé skupiny - zelenou:

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

Je dán následující kód:

<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

Obarvěte obsah prvního divu na červenou barvu, obsah druhého divu - na zelenou, a obsah třetího divu - na modrou. Nastavte pro to každému divu svou třídu.

Je dán následující kód:

<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>
<div>
	<h2>Nadpis</h2>
	<p>
		text
	</p>
	<p>
		text
	</p>
</div>

Obarvěte obsah prvního a třetího divu na červenou barvu, obsah druhého divu a čtvrtého - na zelenou. Pro to prvnímu a třetímu divu dejte jednu třídu, a druhému a čtvrtému - jinou třídu.