Site hosted by Angelfire.com: Build your free website today!
 

table cells, the td tag

tables the td tag

if you copied and pasted the code from the begining of this tutorial you should now have something that looks like this...
my first table

we can change the color at will, all we have to do is specifiy the color in the <TABLE> tag with the 'bgcolor' attribute
lets make the background yellow using the hex color code #FFFF00
<TABLE border=1 bgcolor="#FFFF00">
my first table

lets add another cell

lets add another table definition just by copying everything between the
<TD> and </TD> tags
<TABLE border=1 bgcolor="#FFFF00"> <TR> <TD>my first table</TD> <TD>my first table</TD> </TR> </TABLE>
the code above results in this...
my first table my first table

since we're having so much fun lets add one more cell in exactly the same way
<TABLE border=1 bgcolor=#FFFF00> <TR> <TD>my first table</TD> <TD>my first table</TD> <TD>my first table</TD> </TR> </TABLE>


my first table my first table my first table

It's very easy to add color to indiviual table cells simply by adding the bgcolor attribute to the td tags
<TABLE border="1"> <TR> <TD bgcolor="#FFFF00">my first table</TD> <TD bgcolor="#FFCC00">my first table</TD> <TD bgcolor="#CCFF00">my first table</TD> </TR> </TABLE>


my first table my first table my first table

and heres another good trick
in this cell lines of text can wrap
 in this cell lines of text cannot wrap

the second table cell in the example above uses <td nowrap> but if you decide you want to use nowrap make sure your lines of text are not too long otherwise it's back to the dreaded sideways scroll


on this page we mainly looked at the <TD> tag
on the next page we will look at the <TR> tag

but before moving on it's very much worth pointing out that the font tag should be used inside every table cell to specify the font face, size and color, if the font tag is not used then any text between the td tags will be rendered in the user's default font and that could be anything
html tutorial    html tutorial    html tables tutorial    next :
previous : 		table rows - the tr tag
controlling the size of a table


html tutorial css tutorial javascript webmaster articles link exchange
html tutorial

make money
from your website