Tables

If you have looked at some of the other pages on this site dealing with HTML you may have noticed that the table background color is grey. Or have you seen websites where the tables have colored borders. This is where the bgcolor and bordercolor attributes come into play. For example we can make the table background color grey. All Table Cells Grey <Table bgcolor="#F0F0F0" border="1" Cellspacing="1" Cellpadding="5" WIDTH="85%"> <TR Align="center"> <TD width="60%"> All </TD> <TD width="40%"> Table </TD> </TR> <TR Align="center"> <TD> Cells </TD> <TD> Grey </TD> </TR> </TABLE> This table has a grey background because we placed the bgcolor="#F0F0F0" in the Table tag. There are two ways to define the color when using the bgcolor attribute. You can use a hexidecimal value for the color like #F0F0F0 or you could also use the word grey in the code like this bgcolor="grey". Maybe you wish to color one table cell or a row or use multiple colors. All of these different things can be acheived with the right HTML code. #99CCFF #99CCFF #9999FF White <Table border="1" Cellspacing="1" Cellpadding="5" WIDTH="85%"> <TR Align="center" bgcolor="#99CCFF"> <TD width="60%"> #99CCFF </TD> <TD width="40%"> #99CCFF </TD> </TR> <TR Align="center"> <TD bgcolor="#9999FF"> #9999FF </TD> <TD> White </TD> </TR> </TABLE> In our first TR tag we added the code bgcolor="#99CCFF and this made the background color for the row the same. In the next row we made the first color a different color by placing bgcolor="#9999FF" in the TD tag. The last cell is white (#FFFFFF). You will notice that we didn't use bgcolor to make this table cell white. The reason is that a table, row or cell will use the background color of the page as it's background if one is not defined. In other words a table is transparent. One last use of color with a table. If you want you can add color to the border of a table by using the bordercolor attribute. Table With Colored Border <Table bordercolor="#9999FF" border="2" Cellspacing="1" Cellpadding="5" WIDTH="85%"> <TR Align="center"> <TD width="50%"> Table </TD> <TD width="50%"> With </TD> </TR> <TR Align="center"> <TD bgcolor="#9999FF"> Colored </TD> <TD> Border </TD> </TR> </TABLE>

.