Pdf downloaden
Pdf downloaden
HyperText Markup Language, of in verkorte vorm, HTML, is de basis voor al die webpagina's waar we gebruik van maken op internet. Wat je ook ziet in je browser is gecodeerd in een versie van HTML. Dat geldt ook voor de kleuren van het lettertype. Hier volgen een paar eenvoudige voorbeeld om als gids te dienen bij het leren gebruiken van een aantal standaard HTML-tags om de kleur van tekst te wijzigen met behulp van de <font> tag.
Stappen
Pdf downloaden
-
Selecteer een kleur die je wilt gebruiken voor het lettertype. HTML-lettertypes worden meestal aangegeven met hexadecimale codes die zich vertalen in RGB-kleuren. Er zijn 6 karakters voor elke mogelijke kleur.
- Bijvoorbeeld, rood = ff0000, groen = 00ff00 en blauw = 0000ff. In hex, 00 = nul en ff = 255, de maximale waarde van RGB-kleurendefinities. Hoe hoger het nummer, des te feller te kleur. Bijvoorbeeld, ffffff = wit, en 000000 = zwart.
- Alle kleuren zijn opgebouwd uit verschillende combinaties van de bovenstaande cijfers en letters.
-
Voeg een kleur-tag toe aan je HTML. De syntax voor het toevoegen van de hexadecimale kleurwaarden aan je lettertype is eenvoudig. We gebruiken de tekst "Lorem ipsum dolores sit amet" als voorbeeld. We gaan het woord "dolores" turquoise maken. Hiervoor gebruiken we de <font> tag, als volgt:
- Lorem ipsum <font>dolores</font> sit amet.
- Merk op dat dit nu nog geen effect heeft. Wanneer we er een kleurvariabele aan toevoegen wordt het wat interessanter:
- Lorem ipsum <font color = "40E0D0"> dolores </font> sit amet.
- Merk op dat als je dit in de praktijk probeert, de tag van het lettertype niet in je tekst zult zien. In plaats daarvan ziet je tekst er als volgt uit:
- Lorem ipsum dolores sit amet.
-
Onderzoek elk deel van de tag. Elk deel van de lettertype-tag dient een specifiek doel, dus is het belangrijk om te weten waar elk onderdeel geplaatst moet worden en wat het doet.
- De <font> tag zelf geeft aan dat de tekst die volgt, de regels op moet volgen die in de <font> declaratie worden aangegeven. Wanneer we er "color" aan toevoegen, houdt dit in dat alles wat na de <font color = "40E0D0"> tag komt de kleur zal krijgen die we hebben aangegeven. In dit geval een turquoise kleur, zoals aangegeven door de HTML-waarde "40E0D0", aanhalingstekens niet te vergeten.
- Om de standaardkleur weer te herstellen sluit je de lettertype-tag af met een schuine streep naar voren: </font>. In ons voorbeeld is het woord "dolores" het enige woord dat turquoise is gekleurd.
-
Gebruik namen in plaats van hexadecimale codes. Er zijn 256 kleuren in het standaard HTML-spectrum en hoewel je iets als Photoshop of een website zoals HTML color codes kunt gebruiken als bron om je gewenste kleur te kiezen, kun je ook de naam van een kleur als 147 gebruiken. De standaardkleuren zijn er allemaal: rood, groen ,blauw, geel, zwart en wit, en nog veel meer.
- Bijvoorbeeld, in plaats van "40E0D0" te gebruiken, kun je ook gewoon zeggen "Lorem ipsum <font color = "turquoise"> dolores </font> sit amet.
- Voor een volledige lijst met namen van kleuren die in HTML-code worden gebruikt, ga je naar w3schools .com
Advertentie
Tips
- Overdrijf het niet te veel met kleur-tags. Vroegere websites die lettertypekenmerken overmatig gebruikten zagen er zelfs in de begindagen van het internet vreselijk uit. Ze blijven lelijker dan lelijk, tot op de dag van vandaag!
- Als je weet hoe je om moet gaan met CSS (Cascading Style Sheets), dan kun je dat beter gebruiken. De tag <font> dateert van HTML 3.2 en wordt niet veel meer gebruikt. Een voorbeeld van de kleur rood, aangegeven met CSS, is bijvoorbeeld: .highlighted { color: red; } in het CSS-bestand en <span class="highlighted">jouw tekst komt hier </span> in het HTML-bestand, of zo je wilt, <span style="color: red;">jouw tekst komt hier </span>, wat meestal veel gemakkelijker is om te gebruiken dan de tag <font> zoals hierboven aangegeven, zeker als het gaat om andere functies, zoals het wijzigen van het lettertype of de lettergrootte.
Advertentie
Bronnen
Advertentie
Meld je aan voor de gratis nieuwsbrief van wikiHow!
Je vindt dan elke week handige handleidingen in je inbox.
Meld me aan!
