Table Elements Row - horizontal line of information Column - Vertical line of information Cell - intersection of a row and column Heading cells - display text as bold and center aligned Data cells - display normal text that is left aligned
Table Elements cont’d Table borders - lines that encompass the perimeter of the table Table header - bold text that indicate the purpose of the row or column Table caption - descriptive text located above or below the table that further describes the purpose of the table.
<table><caption>Caption</caption> <tr> </tr> <tr> </tr> </table> If you want the caption on the bottom of the table, type <caption align=bottom>
Table Borders <table border= _____ bordercolor=_____ width= ___% bgcolor=_______> The border is a number which represents the thickness. The width is how much of the screen you want to cover in %. If the width ___% is not included, your table is left aligned and scrunched together.
Border Color of Cells To change the border of a particular cell: <th bordercolor=_____> for heading <td bordercolor=_____> for data
Alignment for cell info Place the alignment tag in the part of the table you wish to align. If you wish to center info in an entire row: <tr align=center> If you wish to only center info in a certain cell <tr><td align=center>
Alignment of a Table To align a table - not the contents of a table <table align=______>
To merge cells in a table To merge columns: <td colspan = _____> Fill in the blank with the number of cells you want to merge over. To merge rows: <td rowspan =______> Fill in blank with the number of rows you want to merge over.
Changing the font color in a table To change the font color in a table, the font color tag must be put at the start of each word in a cell. You must also end it at the end of each cell. …. <tr><td><font color=blue>Hello</font></td></tr> …
Background colors of cells To change the background color of cells: <tr><th bgcolor=_____></th></tr> (Heading cells) <tr><td bgcolor=_____></td></tr> (Data cells) You must put the bgcolor in EACH <th> or <td> tag you want to have a bgcolor.
Adjusting the width of cells <tr><th width=___%> Adjusts width of heading cell <tr><td width=___%> Adjusts width of data cell.