Hoe maak je tekst schuingedrukt of cursief in HTML en CSS?

Italic font in css

Schuingedrukte of cursieve tekst in HTML is eenvoudig te genereren. Dit doe je met de tag <i>...</i>. De i staat voor italic, wat cursief betekent.
Deze HTML code gebruik je als je een tekstgedeelte op een net wat andere, opvallende manier wilt weergeven zonder dat je het vetgedrukt wilt maken. Vetgedrukt heeft namelijk een bepaalde urgentie, iets van: deze tekst is belangrijk. Cursief gebruik je bijvoorbeeld bij namen van planten of schepen, bij technische termen of andere woorden.

Je kunt cursieve tekst ook maken met de HTML code <em>...</em>. In dit geval krijgt de tekst net een klein beetje meer nadruk. Em staat voor emphasis wat nadruk betekent. Je kunt dit bijvoorbeeld gebruiken om in een zin de klemtoon, de nadruk weer te geven.

HTML en CSS voor bloggersIk heb een e-boek gemaakt: HTML & CSS voor bloggers.
Voorzien van een stappenplannen en heldere afbeeldingen om mee aan de slag te gaan.
Vul hieronder je mailadres in en krijg dit e-boek in je mailbox!

Voorbeeld:

<p><em>Ik</em> vind dat Vincent het gekst is.</p>
<p>Ik vind dat <em>Vincent</em> het gekst is.</p>
<p>Ik vind dat Vincent het <em>gekst</em> is.</p>

Resultaat:

Ik vind dat Vincent het gekst is.

Ik vind dat Vincent het gekst is.

Ik vind dat Vincent het gekst is.

Er zijn andere html codes die de tekst cursief weergeven, maar daarbij is het eigenlijk de bedoeling dat deze met CSS aangepast worden naar een andere stijl. Denk bijvoorbeeld aan

Het lettertype Jost met normal en italic versie

Het lettertype Jost met normal en italic versie

Cursief of schuingedrukt in CSS

Natuurlijk kun je met behulp van CSS ook teksten cursief en schuingedrukt weergeven.
Je gebruikt daarvoor de declaratie font-style.

Er zijn drie opties, de standaard instelling is ‘normal’. Dan heb je italic, zoals gezegd dat is cursief. Daarnaast heb je oblique. Daarmee zet je rechte letters schuin. Bij italic maak je gebruik van lettertypes waarbij ook een cursieve versie zit. Veel lettertypes hebben echter geen cursieve versie dus kun je die letters obliek maken, schuin zetten. Eigenlijk is er dus een verschil tussen schuingedrukt (obliek) en cursief (italic).

Voorbeeld:

<h3>Grote woorden</h3>
<p style="font-style: italic">door Jan Janssen</p>
<p>Het was een mooie dag met grote woorden...</p>

Resultaat:

Grote woorden

door Jan Janssen

Het was een mooie dag met grote woorden…

Ik geloof je heus wel!

Je zit echt niet te wachten op weer een saaie nieuwsbrief...
Met allerlei oninteressante informatie.
Maar echt, als je mijn mails probeert, dan beloof ik je te helpen met de zoektocht naar jouw perfecte niche! Zodat jij een website kunt maken rond jouw favoriete onderwerp of idee!
En je krijgt meteen toegang tot mijn gratis downloads. Proberen? Meld je hieronder aan!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *