Hvordan lage tabeller i HTML5 - dummies

Den primære markupbeholderen for tabeller i HTML er tabellelementet. Det vil si at du bruker åpningen

-koden for å angi starten på et bord, og du legger til den avsluttende

-koden for å avslutte den.

Også de grunnleggende byggeblokkene for tabelldata i HTML er tabellruten ( ) og tabelldata ( ), når et bord består av så mange rader som det er elementer (pluss noen topp- eller bunntekstrader) og så mange kolonner som maksimum antall elementer i en gitt tabellrad.

Mellom disse åpnings- og lukkekodene finner du følgende elementer i denne svært interessante og foreskrevne (med andre ord, obligatorisk) rekkefølge:

Null eller en elementer å definere en bildetekst for et bord (hvis det er ett slikt element, eller ingen bildetekst for bordet hvis det er fraværende). Hvis det brukes, må et element følge umiddelbart etter åpningen

-taggen.

Null eller en kolonnegruppe () elementer for å definere kolonnegrupperinger for tabellen (hvis det er ett slikt element, eller ingen kolonnegrupperinger hvis elementet er fraværende). Den må vises etter noe element, hvis det er en til stede, og før noen av de følgende tabellelementene.

Null eller en tabelloverskrift () elementer for å definere overskriftsdelen for et bord (hvis det er ett slikt element, eller ingen tabelloverskrift hvis elementet er fraværende). Ofte strekker en første tabelloverskrift hele bredden av bordet for å identifisere hele greia, og den første overskriften rad etterfølges av en andre rad med enkelte overskrifter for hver kolonne i tabellen.

Null eller flere tabelllegemer (

) elementer for å identifisere aktuelt innhold for tabellen. Et bord kan ha flere elementer, så det er uvanlig i HTML fordi en tabell kun har ett hode, men flere kropper!

null eller en tabell footer () for å gi informasjon til bunnen av et bord. Nettlesere kan bruke,

, og bestemme hva som skal rulles (bordlegemet, vanligvis) og hva du skal forlate alltid til stede på skjermen.

Bordsfoten er et spesielt tilfelle når det gjelder hvor i rekkefølgen av tabelloppslag kan det vises. Det kan alltid vises sist i sekvensen (som det gjør i denne listen), men det kan også vises like etter noen av elementene som er til stede (i denne rekkefølgen):, og.

Det ser imidlertid ut til

og elementer. I dette spesielle tilfellet kan det heller ikke vises på slutten av bordet. Ikke tillatt!

Hvis det ikke er noen

element til stede (som vanligvis definerer tabelllegemet i et bord med en definert tabellhoved og muligens også en bunntekstseksjon), definerer tabellruten ( ) elementet rader for de dataene som tabellen faktisk presenterer.Inne i hver tabellrad er så mange tabelldata (

) elementer da det er celler i den raden.

Siden HTML-tabellens syntaks og oppføringsrekkefølge kan være vanskelig og komplisert, er det enda mer verdifullt enn vanlig å kjøre hele tabelloppdateringen din gjennom W3C Markup Validation Service for å sikre at den er riktig.

Strukturen til et HTML-tabell er lettere å forstå hvis vi representerer det ved å bruke bare grunnleggende containeroppslag, med noen forhåpentligvis opplyste kommentarer, slik som:

Grunnleggende tabelloppsettstruktur og -sekvens
 Tabell 6-1: HTML Markup Structure and Sequence

 Element 
 Beskrivelse 



 tabell 
 samlet tabellbeholder 


 bildetekst 
 tabellteksttekst 


 tbody 
 bordkassebeholder 


 tfoot 
 tabellfoteholder 



 Element 
 Beskrivelse

Figuren viser hvordan en nettleser viser denne tabellen. (Grensen = "1" -oppføringen ble lagt til tabellelementet for å tegne en oversikt rundt kanten av hver tabellcelle, noe som gjør at bordet skiller seg ut litt bedre.)