|
|
<TABLE>
<TR>
<TD>
</TD>
</TABLE>
TABELL 1 - en tabell med bara en cell (en TD):
Det här är en tabell. Den är 240 pixel bred.
Den består av endast en cell (TD). Den är
placerad mitt på sidan.Den kod som behövs
för att skapa en sådan här tabell är:
<TABLE WIDTH= "240">
<TR>
<TD>
Det här är en tabell. Den är 240 pixel...
</TD>
</TABLE>
Om man vill placera den mitt på sidan kan man använda CENTER-taggar
eller DIV ALIGN, så här:
<DIV ALIGN = "center">
<TABLE WIDTH= "240">
<TR>
<TD>
Det här är en tabell. Den är 240 pixel...
</TABLE>
</DIV>
Om man vill ha en tabell med en 2 pixel bred ram kan man skriva så här:
<TABLE BORDER= "2">
<TR>
<TD>
text
</TD>
</TABLE>
|
TABELL 2 - en tabell med två celler (TD) och en rubrik
CAPTION
TABELL 2 CAPTION
|
cell1 cell1 cell1 cell1 cell1 cell1 cell1 cell1 cell1 cell1 cell1 cell1
|
cell2 cell2 cell2 cell2 cell2 cell2 cell2 cell2 cell2 cell2 cell2 cell2
|
Här är koden för den tvåspaltiga tabellen ovan:
<DIV ALIGN = "center">1
<TABLE WIDTH= "400">2
<CAPTION ALIGN= "bottom">TABELL2 CAPTION</CAPTION>3
<TR>
<TD BGCOLOR ="red"
WIDTH = "50%">4
cell1 cell1 cell1 cell1 cell1 cell1
cell1 cell1 cell1 cell1 cell1 cell1
</TD>
<TD BGCOLOR = "blue">
cell2 cell2 cell2 cell2 cell2 cell2
cell2 cell2 cell2 cell2 cell2 cell2
</TD>
</TABLE>
</DIV>
1 om man vill placera
något mitt på en sida kan man placera det mellan
CENTER-taggar eller
använda DIV ALIGN ="center".
DIV ALIGN ="right"
placerar tabellen till höger på sidan.
2 den här tabellens bredd blir
400 pixel
3
rubriker placeras mellan
CAPTION-taggar, ALIGN =
bottom placerar rubriken under tabellen
och ALIGN = top
placerar den över tabellen.
ALIGN
som attribut till
CAPTION
kan komma att upphöra att fungera i framtida
webbläsare.
4 den första (röda) cellens bredd
(TD)
sätts här till 50% av tabellens totala bredd
Sluttaggen </TD> kan utelämnas.
|
TABELL 3: en tabell med fyra celler, två rader
och en ram
-
TR (ny tabellrad) och BORDER
TABELL 3 CAPTION
flowsim: first cell
flowsim: first cell
|
flowsim: second cell
flowsim: second cell
|
flowsim: third cell
flowsim: third cell
|
flowsim: fourth cell
flowsim: fourth cell
|
<CENTER>
<TABLE WIDTH= "400"
BORDER ="1">
<CAPTION ALIGN= "top">TABELL 3 CAPTION</CAPTION>
<TR>
<TD BGCOLOR ="red"
WIDTH = "50%">
flowsim: first cell<BR>
flowsim: first cell
</TD>
<TD BGCOLOR = "blue">
flowsim: second cell<BR>
flowsim: second cell
</TD>
<TR>1
<TD BGCOLOR ="red"
WIDTH = "50%">
flowsim: third cell<BR>
flowsim: third cell
</TD>
<TD BGCOLOR = "blue">
flowsim: fourth cell<BR>
flowsim: fourth cell
</TD>
</TABLE>
</CENTER>
1 tabellrad
|
|
Det här är en enspaltig tabell med BORDER satt till 10.
|
TABELLER: cellspacing (utrymme mellan tabellceller).
det översta exemplet<TABLE CELLSPACING = "0">
det undre exemplet <TABLE CELLSPACING = "20">
|
flowsim
|
flowsim
|
|
flowsim
|
flowsim
|
|
flowsim
|
flowsim
|
|
flowsim
|
flowsim
|
TABELLER: cellpadding (utrymme mellan cellens innehåll och dess ram)
det översta exemplet<TABLE CELLPADDING = "0">
det undre exemplet <TABLE CELLPADDING = "20">
|
flowsim
|
flowsim
|
TABELL 4: TD ROWSPAN - hur många rader en cell spänner över
TABELL 4: ROWSPAN
|
flowsim
|
flowsim
|
|
flowsim
|
<CENTER>
<TABLE WIDTH= "400"
BORDER ="1">
<CAPTION ALIGN= "top">TABELL 4: ROWSPAN</CAPTION>
<TD BGCOLOR ="red"
WIDTH = "50%"
ROWSPAN = "2">
flowsim
</TD>
<TD BGCOLOR = "blue">
flowsim
</TD>
<TR>
<TD BGCOLOR = "blue">
flowsim
</TD>
</TABLE>
</CENTER>
|
TABELL 5: TD COLSPAN - hur många kolumner en cell spänner över
TABELL 5: COLSPAN
|
flowsim
|
|
flowsim
|
flowsim
|
<CENTER>
<TABLE WIDTH= "400"
BORDER ="1">
<CAPTION ALIGN= "top">TABELL 5: COLSPAN</CAPTION>
<TR>
<TD BGCOLOR ="red"
COLSPAN = "2">
flowsim
</TD>
<TR>
<TD BGCOLOR = "blue">
flowsim
</TD>
<TD BGCOLOR = "blue">
flowsim
</TD>
</TABLE>
</CENTER>
|
TABELLER: hur man placerar cellinnehållet (text el bild) horisontellt
 <TD ALIGN="left|center|right">
|
<TD ALIGN ="left">
|
<TD ALIGN ="center">
|
<TD ALIGN ="right">
|
|
flowsim
|
flowsim
|
flowsim
|
|
|
|
TABELLER: hur man placerar cellinnehållet (text el bild) vertikalt:
<TD VALIGN="top|middle|bottom">
|
<TD VALIGN = "bottom">
|
<TD VALIGN = "middle">
|
<TD VALIGN = "top">
|
|
flowsim
|
flowsim
|
flowsim
|
|
|
tabell - enklaste varianten