Table cells can span across more than one column or row. The attributes
COLSPAN |
Production | |
---|---|
Raha Mutisya | 1493 |
Shalom Buraka | 3829 |
Brandy Davis | 0283 |
Sales | |
Claire Horne | 4827 |
Bruce Eckel | 7246 |
Danny Zeman | 5689 |
It often happens with multiple-column cells that a little color helps to set off the headers, giving the table a more visually organized look. Let's add some color to the headers using BGCOLOR
<TABLE BORDER=2 CELLPADDING=4> <TR> <TH COLSPAN=2 BGCOLOR="#99CCFF">Production</TH> </TR> <TR> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH COLSPAN=2 BGCOLOR="#99CCFF">Sales</TH> </TR> <TR> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE>
which gives this table:
Production | |
---|---|
Raha Mutisya | 1493 |
Shalom Buraka | 3829 |
Brandy Davis | 0283 |
Sales | |
Claire Horne | 4827 |
Bruce Eckel | 7246 |
Danny Zeman | 5689 |
ROWSPAN
ROWSPAN
This table code creates two header cells which span three rows each:
<TABLE BORDER=2 CELLPADDING=4> <TR> <TH ROWSPAN=3 BGCOLOR="#99CCFF">Production</TH> <TD>Raha Mutisya</TD> <TD>1493</TD> </TR> <TR> <TD>Shalom Buraka</TD> <TD>3829</TD> </TR> <TR> <TD>Brandy Davis</TD> <TD>0283</TD> </TR> <TR> <TH ROWSPAN=3 BGCOLOR="#99CCFF">Sales</TH> <TD>Claire Horne</TD> <TD>4827</TD> </TR> <TR> <TD>Bruce Eckel</TD> <TD>7246</TD> </TR> <TR> <TD>Danny Zeman</TD> <TD>5689</TD> </TR> </TABLE>
which creates
Production | Raha Mutisya | 1493 |
---|---|---|
Shalom Buraka | 3829 | |
Brandy Davis | 0283 | |
Sales | Claire Horne | 4827 |
Bruce Eckel | 7246 | |
Danny Zeman | 5689 |
Note that in the two rows after each header, the first cell in the row ends up in the second column because the first column is taken up by the multi-column cell.