Tekstvetdikte in CSS

In deze les bestuderen we de eigenschap font-weight, die het mogelijk maakt om tekst vet te maken of omgekeerd - vetdikte op te heffen (bijvoorbeeld voor koppen, die standaard vet zijn). Om tekst vet te maken, moet je de waarde bold opgeven, en om vetdikte op te heffen - de waarde normal.

Deze eigenschap werkt op dezelfde manier als de tag b, die we al hebben behandeld. Het verschil is dat het veel handiger is om vetdikte via CSS te beheren - je kunt bijvoorbeeld alle alinea's vet maken en alle koppen - niet vet, met slechts een paar regels in het CSS-bestand.

Als ik vet zou maken via de tag b - zou ik de inhoud van elke alinea moeten wrappen in deze tag, en dat zou erg tijdrovend zijn (en als ik later de vetdikte van de alinea's wil verwijderen - moet ik al deze tags verwijderen, stel je voor hoeveel extra, zinloos werk dat is).

In het volgende voorbeeld maken we alle alinea's vet, en alle koppen h2 - niet vet:

html<h2>Title</h2>
<p>
  This is a paragraph with text.
</p>

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

Результат:

html<table border="1">
  <tr>
    <th>Name</th>
    <th>Surname</th>
    <th>Salary</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>