PARTS OF A <TABLE>
<TABLE>...</TABLE>
These tags provide the container for all other table tags.
Browsers ignore the other table tags if they aren't contained inside these tags.
The <TABLE> tags accepts
the attributes of ALIGN,
BORDER, CELLPADDING, CELLSPACING,
and WIDTH.
<TR>...</TR>
The table row tags contain the information for all the
cells within each row of the table. Each set of table row tags represents a single row in
the table, regardless of the number of cells in a row. The table row tag can contain both
the ALIGN and VALIGN attributes,
which is specified, become the default alignments for all cells in the row.
The <TR> tag accepts the
attributes of ALIGN and VALIGN.
<TD>...</TD>
Each cell in the table is defined by the table data tags,
which must be nested within table row tags. The following are good tidbits to know about
table data tags and how they work.:
- You don't have to worry about making each row contain the
same number of cells because short rows are padded with blank cells on the right.
- A cell can contain any HTML tag normally used within the
body of an HTML document.
The <TD> tag accepts the
attributes of ALIGN,
COLSPAN, HEIGHT,
NOWRAP, ROWSPAN, VALIGN,
and WIDTH.
<TH>...</TH>
Table header tags display text in BOLD with the
default of ALIGN="center". Otherwise, they are identical to table data
tags,<TD>.
<CAPTION>...</CAPTION>
Place the <CAPTION> tags inside
the <TABLE> tags but not inside the table row tags or
cells. Like table cells, any document body HTML can appear in a caption. Captions are
horizontally centered with respect to the table, and their lines are wrapped to fit within
the width of the table.
The <CAPTION> tag accepts the
attributes of ALIGN.
Basic Table Attributes
You can use several attributes with the table tags. Innovative use
of these attributes is the key to making your tables truly outstanding or, at least,
interesting.
ALIGN="(top/bottom/left/center/right)"
When you use the ALIGN attribute with
the <CAPTION> tag, specify ALIGN="top"
or ALIGN="bottom" to control whether the caption
appears above or below the table. The default alignment of the caption is "top".
When you use ALIGN inside of a <TABLE>, <TR>, <TH>, or <TD>
tag, ALIGN accepts values of left, center, or right to
control the horizontal placement of text within the cells. The default value of ALIGN
for these tags is left.
BORDER="number"
You use the BORDER attribute in the <TABLE> tag to instruct the browser to display borders around
the table and all the table cells. Space is left for borders around tables so the tables
width does not change when a border is added. If no number is specified, BORDER defaults to a width of one (1).
CELLPADDING="number"
When used within the <TABLE>
tag, the CELLPADDING value indicates the amount of space
between the border of a cell and the contents of the cell. The default value is one pixel.
Setting the cell padding to zero on a table with borders causes the text to touch the
border. Padding cells can help you greatly enhance the visual impact of your tables,
especially when you couple the padding with cell spacing and border sizing.
CELLSPACING="number"
You use the CELLSPACING attribute
within the <TABLE> tag to represent the amount of space
inserted between individual cells in a table. The default value is two pixels between
cells. Couple this with the CELLPADDING attribute and you can
really make interesting looking tables.
WIDTH=("number/percent%")
You can use the WIDTH attribute
inside the <TABLE> tag to set the width of the table as
an absolute width in pixels or as a percentage of the browser display area.
When you use the WIDTH attribute in
the <TH> or <TD>
tag, you set the width of the cell as an absolute width in pixels or as a percentage of
the table width.
VALIGN="(top/middle/bottom/baseline)"
The VALIGN (vertical alignment)
attribute is used inside a <TR>, <TH>, or<TD> tag to control the placement of the cell's contents at
the top, middle, or bottom of the cell or to align all elements with a common baseline.
NOWRAP
When you use the NOWRAP in a table
cell (<TD> or <TH>),
the NOWRAP attribute forces the browser to display all of the
text for that particular cell on a single line. Using this attribute can cause very
wide cells, so be careful.
COLSPAN="number"
Use COLSPAN in any table cell to
specify how many columns of the table the cell should span if you want to span more than
the default of one cell.
ROWSPAN="number"
Use ROWSPAN in any table cell to
specify how many rows of the table the cell should span if you want to span more than the
default of one cell.
|