TABELLER & LAYOUT (1 AV 2)TABLE, TR, TD & THSom ni säkert har förstått så är HTML inte det lättaste att hantera när det gäller layout. Man kan inte riktigt få bilden eller texten där man vill ha den. Det är där tabellerna kommer in. Idag kan man nästan inte hitta en hemsida där tabeller inte har använts. Det är helt enkelt det bästa sättet att placera saker på rätt plats.Tabellerna består av rader och kolumner i det antal du skriver in. Tabellen, en viss rad eller en viss kolumn kan ha en fast bredd eller höjd i punkter eller en relativ bredd eller höjd i procent. Alla celler kan ha olika justeringsattribut eller bakgrundsfärg. Tabellerna börjar och slutar alltid med en TABLE-tag, Varje rad i tabellen börjar och slutar alltid med en TR-tag (Table Row). Inom varje rad kan man ha valfritt antal celler, TD (Table Data), som bildar kolumner. <TABLE> Resultatet av denna tabell kanske inte är så fint. Med det förklarar grundprincipen. Vanligtvis brukar man skriva med olika indrag för rader och celler för lättare överblick. Man brukar också skriva en cell per rad för att lättare hålla reda på antal och ordning. (se nästa exempel) Om man vill kan man skriva TH (Table Heading) istället för TD. Då blir all text i cellen centrerad och skriven med fetstil, som en kolumn- eller radrubrik.
Border, cellspacing & cellpaddingDet finns en mängd attribut som hänger ihop med tabeller, rader och celler, exempelvis BORDER, CELLSPACING och CELLPADDING. Border bestämmer hur stor ram det skall vara i ytterkanten. Cellspacing bestämmer hur stort avstånd det skall vara mellan cellerna och cellpadding bestämmer avståndet från texten eller objektet i cellen till dess ytterkant. Alla värden är i antal punkter.Attributen skrivs i TABLE-taggen som följer. <TABLE BORDER="5" CELLSPACING="2" CELLPADDING="10"> Vill man inte ha någon ram eller mellanrum så sätter man alla värden till noll.
Bredd & höjdBredden och höjden på tabellen och cellerna går att ställa in i antal punkter eller i antal procent av det tillgängliga utrymmet. Som standard blir tabellen så liten som möjligt. Skriver du en rad text i en tabell så blir den bara en rad hög. Lägger du in två bilder på vardera 100 punkters bredd så blir tabellen 200 punkter bred.Det går inte att "tvinga" ner storleken på en tabell eller cell. Den gör alltid plats för det som behövs. Däremot kan man se till att tabellen blir större än den egentligen skulle ha varit. Värdena ställer man in med samma attribut som användes på bilderna, WIDTH och HEIGHT. De kan användas på TABLE, TD och TH. <TABLE WIDTH="95%" HEIGHT="150" BORDER="5" CELLSPACING="2" CELLPADDING="10"> Om man ställer in bredden och höjden på en cell så blir höjden lika på alla celler i den raden och bredden lika på alla celler i den kolumnen. Man behöver alltså inte skriva in värden i alla celler.
Justering & bakgrundsfärgAlla celler och rader kan som sagt justeras individuellt. Detta görs med ALIGN och VALIGN-taggen. Align bestämmer hur texten eller objekten skall justeras i sidled och valign i höjdled.Align-taggen kan ha värdena left, right eller center. Alltså vänster- eller högerjusterat eller centrerat. Valign-taggen kan ha värdena top, bottom eller middle. Alltså justerat mot toppen, botten eller mitt på i höjdled. Standard är på TR och TD, left och middle. På TH är det center och middle. Cellerna och raderna kan även ha en valfri bakgrundsfärg. Som standard är de genomskinliga. Bakgrundsfärgen anges precis som den i BODY-taggen, med BGCOLOR. <TABLE WIDTH="75%" HEIGHT="350" BORDER="0" CELLSPACING="2" CELLPADDING="10">
|
1997-2000