Teksti paksus CSS-is

Selles õppetükis uurime omadust font-weight, mis võimaldab teha teksti paksuks või vastupidi - eemaldada paksuse (näiteks pealkirjade puhul, mis on vaikimisi paksud). Et teha tekst paksuks, tuleb määrata väärtus bold, ja et eemaldada paksus - väärtus normal.

See omadus töötab sarnaselt sildile b, mida me juba läbi võtsime. Erinevus on selles, et CSS-iga on paksuse haldamine palju mugavam - saab näiteks muuta kõik lõigud paksuks ja kõik pealkirjad - mittepaksuks, tehes vaid paar kirjet CSS faili.

Kui ma teeksin paksu läbi sildi b - peaksin iga lõigu sisu mähkima sellesse sildi, ja see oleks väga ajakulukas (ja kui ma hiljem tahaksin eemaldada lõikude paksuse, peaksin eemaldama kõik need sildid, kujutlege, kui palju see on lisatööd, mõttetut tööd).

Järgmises näites teeme kõik lõigud paksuks ja kõik pealkirjad h2 - mittepaksuks:

<h2>Pealkiri</h2>
<p>
	See on tekstiga lõik.
</p>

h2 {
	font-weight: normal;
}
p {
	font-weight: bold;
}

Kopeeri järgmine HTML kood oma lehele:

<table border="1">
	<tr>
		<th>Nimi</th>
		<th>Perekonnanimi</th>
		<th>Palk</th>
	</tr>
	<tr>
		<td>John</td>
		<td>Smith</td>
		<td>200$</td>
	</tr>
	<tr>
		<td>Nick</td>
		<td>Mayers</td>
		<td>300$</td>
	</tr>
	<tr>
		<td>Alex</td>
		<td>Jonson</td>
		<td>400$</td>
	</tr>
</table>

Määra tabelile laius 500px, ja kõrgus 300px. Tee lahtrid td paksuks ja keskele joondatuks, ning lahtrid th - mittepaksuks.