Oznaka div za združevanje oznak v HTML

V prejšnji lekciji smo obravnavali oznako span, ki omogoča določeno označevanje delčka besedila. Obstaja tudi posebna oznaka div, ki omogoča združevanje več oznak, da lahko z njimi naredimo nekaj hkrati.

Na primer, z oznakami div združimo odstavke:

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

Elementom iz prve skupine dodelimo rdečo barvo, elementom iz druge skupine - zeleno:

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

Podana je naslednja koda:

<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>
<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>
<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>

Barvajte vsebino prvega div-ja v rdečo barvo, vsebino drugega div-ja - v zeleno, in vsebino tretjega div-ja - v modro. Vsakemu div-ju dodelite svoj razred.

Podana je naslednja koda:

<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>
<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>
<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>
<div>
	<h2>Naslov</h2>
	<p>
		besedilo
	</p>
	<p>
		besedilo
	</p>
</div>

Barvajte vsebino prvega in tretjega div-ja v rdečo barvo, vsebino drugega div-ja in četrtega - v zeleno. Za to prvemu in tretjemu div-ju dajte en razred, drugemu in četrtemu - drug razred.