HTML Attributen

HTML class attribuut

  • Het class attribuut specificeert de klassenaam van een element.
  • Met het class attribuut wordt meestal een klasse in een stylesheet aangeduid.
  • De class selector wordt gedefinieerd met een "." (punt)

Voorbeeld

<html>
<head>
<style type="text/css">
.kop {color:#ff00ff;}
.tekst {font-family:Arial; font-size:20px;}
.nota {color:red; font-size:12px;}
</style>
</head>
<body>
<h1 class="kop">Koptekst in kleur #ff00ff.</h1>
<p class="tekst">Dit is een paragraaf in lettertype Arial, lettergrootte 20pixels.</p>
<p class="nota">Nota in rode kleur, lettergrootte 12px.</p>
</body>
</html>
  • Voor het resultaat van het voorbeeld hierboven klik code

Attribuut waarde

Waarde Beschrijving
klassenaam Specificeert de klassenaam voor een element.
Wanneer er meerdere klassenamen voor één element worden gespecificeert worden deze gescheiden door een spatie.
voorwaarden :
  • Moet beginnen met een letter A_Z of a-z
  • Kan worden gevolgd door letters, cijfers, verbindingsstreepjes en underscores
  • De waarden zijn hoofdlettergevoelig in HTML

Opbouw

<element class="klassena(a)m(en)">.  .  .  .</element>

naar boven 

nota

Het class attribuut kan NIET worden gebruikt in de base, head, html, meta, param, script, style, en title elementen !

tip

Er kunnen meerdere classes toegepast worden op één HTML element, deze worden gescheiden door een spatie !

Voorbeeld met meerdere classes in één element

  • Voor de code van onderstaand voorbeeld klik code

Koptekst in kleur #cd8f1d,
groene achtergrondkleur,
wordt gecentreerd weergegeven.

Browser ondersteuning

Internet Explorer Firefox Chrome Opera Safari

  • Het HTML class attribuut wordt ondersteunt door de bekende browsers.
  • Een klassenaam mag NIET beginnen met een cijfer! (dit wordt enkel ondersteunt in Internet Explorer)
naar boven naar boven naar id attribuut
naar boven naar het id attribuut