Wat is het id-attribuut op een webpagina?

Op websites kom ik regelmatig het id-attribuut tegen. BIjvoorbeeld:

<div id="header">

Wat doet dat "id" eigenlijk?

die id verwijst naar een id-declaratie in de CSS

meestal staat in die CSS dan iets als:

#header {
background: logo.gif no-repeat;
}

bvb

id is eigenlijk niks, het is de div waar je naar moet kijken. De id is alleen maar een vlaggetje. Het is de code achter CSS, cascaded stylesheets.

De id verwijst naar de gegevens die gebruikt worden om vorm en typografie te bepalen in de stylesheet.

Een beetje losse uitleg vind je hier

je kan ook nog een <div class=justifiedtext> hebben die dan naar de css verwijst

.justifiedtext {
text-align: justify;
}

bijvoorbeeld

id is gewoon een afkorting van identifier, en dat is het ook. De naam voor een stijldefenitie wordt hiermee aangekondigd.

[quote:b78afa9524="EL Mystica"]die id verwijst naar een id-declaratie in de CSS

meestal staat in die CSS dan iets als:

#header {
background: logo.gif no-repeat;
}

bvb[/quote:b78afa9524]

Wat is dan het verschil tussen een id en een class?

Goede vraag! Id gebruik ik altijd in divs en class in spans, maar of dat ook moet?

Een ID mag per definitie slechts 1 keer in gans de pagina voorkomen. Het CLASS attribuut daaretnegen mag je meermaals gebruiken.

Voorbeeld:

  • Voor een header in je pagina ga je eerder een ID gebruiken, aangezien die maar één keer voorkomt bovenaan je pagina.
  • Om de layout van een reactie bij een nieuwsbericht op te maken gebruik je dan weer een CLASS, aangezien er meerdere reacties kunnen voorkomen.

Het meermaals gebruiken van eenzelfde ID zal ervoor zorgen dat je pagina NIET valideert.

Als laatste puntje wil ik nog aanhalen dat een CLASS attribuut meerdere waarden kan hebben (geschieden door spaties), als volgt:

<div class=“comment author”> … <div>

Dit zou je bijvoorbeeld kunnen gebruiken om aan te geven dat iets een reactie is en dat die reactie van de auteur is, daar waar reacties van gewone gebruikers enkel ‘comment’ zouden hebben als class attribute.

Een ID mag één en slechts één waarde bevatten.

Een uitgebreidere bespreking vind je hier:
http://css-discuss.incutio.com/?page=ClassesVsIds

Bondig:

[quote:6511528118]- Classes are useful to apply similar declarations to a variety of elements.

  • IDs are useful to uniquely identify a particular element.[/quote:6511528118]

Je kunt tevens naar een object met een id linken op deze manier: [code:1:238f74a00e]<a href="#id">Ga naar id</a>[/code:1:238f74a00e]

... of in javascript naar een element met een id verwijzen: [code:1:6a515ce58d]document.getElementById("header")[/code:1:6a515ce58d]