Grunden i tabeller

Både hatade och älskade :)
Älskade för att man styr utseendet på webbsidor i detalj, hatade för att små missar kan skapa kaos på webbsidan.

Jag rekommenderar användning av tabeller enbart i samband med ett hemsideprogram. Anledningen till det är att det snabbt kan bli krångligt med alla kolumner och rader.

I ett hemsideprogram kan du experimentera med alla valmöjligheter som finns i meny för tabeller. Bland annat kan man bestämma tabellbredden, bakgrundsfärgen, infoga rader, sammanfoga celler o s v.

Målet med den här boken är att ge grundläggande kunskap i HTML. Därför kommer jag inte att gå igenom hur man gör webbsidor m h a tabeller. Det ända jag presenterar här är märkena som tabellerna representeras med och hur man använder enkla tabeller i sina webbsidor.
En enkel tabell ser ut så här:

<TABLE>
  <TR>
    <TD>Text 1</TD>
    <TD>Text 2</TD>
  </TR>
</TABLE>

Du ser en klar hierarki i koden. Det får man inte bryta om man inte vill bli överraskad av utseendet på webbsidan.

TABLE-märket startar med <TABLE> och slutar med </TABLE>. Det som finns mellan är kolumner och rader i tabellen med tillhörande innehåll.

TR-märket förekommer i samband med TABLE-märket, och alltid inom TABEL-märket (innan det stängs). TR står för ”table row” och är början på en ny rad (horisontellt) i tabellen.
I vårt lilla exempel har vi bara en rad. Den enklaste tabellen måste ha minst ett TR-märke (om inte kolumnmärke existerar).

TD-märket (table data) uppträder på samma sätt som TR-märket. Skillnaden är att det definierar kolumner.

Sedan har vi en rad attribut för alla tre märken. Det går jag inte igenom i detalj i den här boken.

BORDER-attribut har du redan sett i samband med bilder. Det har samma uppgift även här: anger tjockleken på ramen runt tabellen.

HEIGHT- och WIDTH-attribut anger höjden respektive bredden på TABLE, TR och TD märkena. Värdet man anger är utryckt i pixel. En viktig sak man ska tänka sig för när man definierar höjden och bredden är att man inte kan ha större bredd/höjd på en cell (radkolumn) än man har på hela tabellen.

BGCOLOR- och BACKGROUND-attribut fungerar på samma sätt som BGCOLOR och BACKGROUND för BODY-märket vilket jag förklarade tidigare.

Om man lägger en bild i bakgrunden i BODY-märket och en annan bild i TABLE-märket, vilken kommer att visas i tabellens rader och kolumner?
Testa så får du se själv 

Andra bloggar om: html, webb, blogg

Written by admin on mars 17th, 2007 with 2 comments.
Read more articles on HTML grunder.