Creating Tables, page three
Table Colors
You can choose your background colors for the whole table, or
for
a table cell or row. Use the BGCOLOR tag in the <BORDER>, <TABLE>
<TR> and/or <TD> tags, as you used it in the <BODY> tag.
Note that if you use multiple colors, a <TD> bgcolor will override a
<TR> bgcolor and a <TR> bgcolor will override a <TABLE>
bgcolor.
For choosing your hex colors from the 216 color table, try:
the
Color Picker
the 216 Netscape color
chart
or other links to 216 color charts at Webwinds' Webclass page.
Example One:
<TABLE BORDER=3 BGCOLOR="#FFCC66"><TR>
<TD>My</TD>
<TD>Simple</TD>
<TD>Table</TD>
</TR></TABLE>
| My | Simple | Table |
Example Two:
<TABLE BORDER=3>
<TR BGCOLOR="#FF9999">
<TD>My</TD>
<TD>Simple</TD>
<TD>Table</TD>
</TR>
<TR BGCOLOR="#99CCCC">
<TD>With</TD>
<TD>Two</TD>
<TD>Colors</TD>
</TR></TABLE>
| My | Simple | Table |
| With | Two | Colors |
Example Three:
<TABLE BORDER=3>
<TR BGCOLOR="#99CCCC">
<TD>My</TD>
<TD>Multicored</TD>
<TD>Table</TD>
</TR>
<TR>
<TD BGCOLOR="#CCCC99">With</TD>
<TD>BGCOLOR="FF9999"Four</TD>
<TD BGCOLOR="#00FFFF">Colors</TD>
</TR>
</TABLE>
| My | Multicolored | Table |
| With | Four | Colors |
Table Summary Notes: Example
<TABLE BORDER=1 CELLSPACING=3 CELLPADDING=3 WIDTH="75%">
<TR BGCOLOR="#99CCFF">
<TD align=center>First cell, <BR>first row</TD>
<TD align=center>First row, second cell </TD> </TR>
<TR> <TD align=center BGCOLOR="#33CCCC">First cell,
<BR> second row </TD>
<TD align=center BGCOLOR="#66FF33">Second cell, second row
</TD>
</TR> </TABLE>
| First cell, first row |
First row, second cell |
| First cell, second row |
Second cell, second row |
Table Summary Notes: Exercise
| First cell, first row | First row, second cell | First row, third cell |
| First cell,second row | Second cell, second row | Third cell, second row. |
These Tables Notes have been adapted from the Tables Tutorial
at http://www.pagetutor.com/pagetutor/tables/index.html
For further tables training, see lessons 4-7 of this tutorial. Topics
covered include <colspan> and <rowspan> for merging cells.
For instructions on how to create a web page with a left border,
go to http://www.webwinds.com/psicorn/border.htm
For a template for using tables to create a web page with a left
border,
go to http://www.webwinds.com/psicorn/psicorn.htm
Go back to Tables, page one
Go back to Tables, page two
Borders Design Interm.Design
Lists Alignment
