Tekst benadrukken met <span style="...;">

Je kunt sommige stukken tekst op een web-pagina benadrukken door ze cursief of vet te zetten, of te onderstrepen. Maar je kunt ook de kleur van de letters en/of de kleur van de achtergrond tijdelijk veranderen. Je kunt tekst ook benadrukken door de letters groter te maken.

Voor het tijdelijk veranderen van de tekst-attributen kun je gebruik maken van de tags <i>...</i>, <b>...</b> en <u>...</u>. Dat geeft achtereenvolgens de tekst weer als cursief, vet en onderstreept. Meestal is dat voldoende, maar zie ook de opmerking onderaan deze bladzijde.

Voor het veranderen van de tekstgrootte en -kleur en achtergrond-kleur moet gebruik worden gemaakt van <span>-tags waarmee tekst attributen worden veranderd met behulp van style.

Voor het bovenstaande zijn de volgende tags gebruikt:

• <span style="font-style:italic;">cursief</span>

  Resultaat: cursief

• <span style="font-weight:bold;">vet</span>

  Resultaat: vet

• <span style="text-decoration:underline;">onderstreept</span>

  Resultaat: onderstreept

• <span style="color:#88BB44;">kleur van de letters</span>

  Resultaat: kleur van de letters

• <span style="background-color:#DDFFDD;">kleur van de achtergrond</span>
  

  Resultaat: kleur van de achtergrond

• <span style="font-size:14pt">groter</span>

  Resultaat: groter

Let op de punt-komma's en de plaats van de dubbele aanhalingstekens bij style=....
De punt-komma mag worden weggelaten als er maar één attribuut door de style wordt gewijzigd.

Combinaties zijn ook mogelijk, zoals:

• <span style="color:#f84; background-color:#ddd; font-weight:bold; font-size:16pt; text-decoration:underline; font-style:italic">Combinatie</span>

  Resultaat: Combinatie

In plaats van <span style="..."> kun je ook gebruik maken van <span class="...">. Dit is handig als een tijdelijke opmaak-wijziging meer dan één keer op een pagina voorkomt.
De class is gedefinieerd in een aparte style-sheet, zie het item "Eenvoudige <style>-sheets voor tekst".

Voor een uitgebreide beschrijving van de style-attributen verwijzen we naar w3schools.com (Engels).

Opmerking:
 
Onderstrepen doe je met de tags <u> en </u>. Het kan ook met een inline-style. Je gebruikt dan:<span style="text-decoration:underline">.....</span>, al of niet in combinatie met andere style-attributen.
 
Het onderstrepen van tekst in HTML kan tot verwarring leiden met hyperlinks, omdat die meestal al (automatisch) door de browser worden onderstreept. Voorzichtig toepassen dus.