The TABLE element is a container for additional elements that specify the content for a table. A table consists of rows and columns of content. Other elements related to the TABLE element are CAPTION, COL, COLGROUP, TBODY, TD, TFOOT, TH, THEAD, and TR. The purpose of the TABLE element is to define a number of visible attributes that apply to the entire table, regardless of the number of rows or columns within it. Many of these attributes can be overridden for a given row, column, or cell. The number of rows and columns is strictly a factor of the structure of TR and TD elements within the table.

Tables have been used for a relatively long time not only to organize rows and columns of content but also to position content. With no visible borders, table rows and columns can be set to empty space. With the advent of positionable content, the tables-for-positioning practice is not encouraged.

Determines how the table is aligned relative to the next outermost container (usually the document BODY). The ALIGN attribute is deprecated in HTML 4.0 in favor of style sheet attributes.

Specifies an image file that is used as a backdrop to the table. Unlike normal images that get loaded into browser content, a background image loads in its original size (without scaling) and tiles to fill the available table space. Smaller images download faster but are obviously repeated more often in the background. Animated GIFs are also allowable, but very distracting to the reader. When selecting a background image, be sure it is very muted in comparison to the main content so that the content stands out clearly. Background images, if used at all, should be extremely subtle.

Establishes a fill color (behind the text and other content) for the entire table. If you combine a BGCOLOR and BACKGROUND, any transparent areas of the background image let the background color show through. This attribute is deprecated in HTML 4.0 in favor of the background-color style attribute.

The thickness (in pixels) of the border drawn around a TABLE element. If you set the BORDER attribute to any value, browsers by default render narrow borders around each of the cells inside the table. The thickness of internal borders between cells are defined by the CELLSPACING attribute of the TABLE element.

If you include only the BORDER attribute without assigning any value to it, the browser renders default-sized borders around the entire table and between cells, unless overridden by other attributes.

Browsers render the border in a 3-D style, with the border appearing to be raised around the flat content in the cells. Numerous other attributes affect the look of the border, including: BORDERCOLOR, BORDERCOLORDARK, BORDERCOLORLIGHT, FRAME, and RULES. The type of border rendered for tables is different from the borders defined by style sheet rules. You get better control of the border look by using the dedicated attributes of the TABLE element.

The colors used to render some of the pixels that create the illusion of borders around cells and the entire table. The BORDER attribute must have a nonzero value assigned for the color to appear. The 3-D effect of borders in Navigator and Internet Explorer is created by careful positioning of light (or white) and dark lines around the page's background or default color (see ). Standard colors are usually shades of gray and white, depending on the browser.

Applying color to a table border has a different effect in Navigator and Internet Explorer. In Navigator, the color is applied to what is normally the darker of the two shades used to create the border. Moreover, Navigator automatically adjusts the darkness of some of the lines to enhance the 3-D effect of the border. In contrast, Internet Explorer applies the color to all lines that make up the border. The net effect is to flatten the 3-D effect (refer to the BORDERCOLORDARK and BORDERCOLORLIGHT attributes to color borders and maintain the 3-D effect).

The 3-D effect of table borders in Internet Explorer is created by careful positioning of light and dark lines around the page's background or default color (see Figure 8-4). You can independently control the colors used for the dark and light lines by assigning values to the BORDERCOLORDARK and BORDERCOLORLIGHT attributes. The BORDER attribute must have a nonzero value assigned for the colors to appear.

Typically, you should assign complementary colors to the pair of attributes. There is also no rule that says you must assign a dark color to BORDERCOLORDARK. The attributes merely control a well-defined set of lines so you can predict which lines of the border change with each attribute.

The amount of empty space between the border of a table cell and the content of the cell. Note that this attribute applies to space inside a cell. Without setting this attribute, most browsers render text content so that its leftmost pixels abut the left edge of the cell. If the table displays borders, adding a few pixels of breathing space between the border edge and the content makes the content more readable. Large padding may also be desirable in some design instances. This attribute is not as noticeable when the table does not display borders (in which case the CELLSPACING attribute can assist in adjusting the space between cells).

The amount of empty space between the outer edges of each table cell. If you set the BORDER attribute of the TABLE element to any positive integer value, the effect of setting CELLSPACING is to define the thickness of borders rendered between cells. Even without a visible border, the readability of a table often benefits from cell spacing.

The number of columns of the table. The HTML specification never adopted this attribute. In HTML 4.0, the functionality of this attribute is covered by the COLGROUP and COL elements. In the meantime, the COLS attribute is recognized by current browsers. The attribute assists the browser in preparation for rendering the table. Without this attribute, the browser relies on its interpretation of all downloaded TR and TD elements to determine how the table is to be divided.

Used with IE 4 data binding, this attribute advises the browser how many instances of a table row must be rendered to accommodate the number of data source records set by this attribute. A common application is setting a table cell to display a text INPUT element whose DATAFLD attribute is bound to a particular column of the data source (the DATASRC is set in the TABLE element). If the DATAPAGESIZE attribute is set to 5, the browser must display five rows of the table (but the row is specified in the HTML only once).

Used with IE 4 data binding to specify the name of the remote ODBC data source (such as an Oracle or SQL Server database) to be associated with the element. Content from the data source is specified via the DATAFLD attribute in individual TD elements. A block of contiguous records can be rendered in the table when you also set the DATAPAGESIZE attribute of the table.

The direction of character rendering and table cell rendering for the element. Character and cell rendering is either left-to-right or right-to-left. This attribute is usually set in concert with the LANG attribute and must be used to specify a character rendering direction that overrides the current direction.

Defines which (if any) sides of a table's outer border (set with the BORDER attribute) are rendered. This attribute does not affect the interior borders between cells. Including the BORDER attribute without assigning any value to it is the same as setting the FRAME attribute to border.

The rectangular dimensions of a table that may be different from the default size as calculated by the browser. When the values for these attributes are less than the minimum space required to render the table cell content, the browser overrides the attribute settings to make sure that all content appears, even if it means that text lines word-wrap. You can also stretch the dimensions of a table beyond the browser-calculated dimensions. Extra whitespace appears inside table cells to make up the difference. If you specify just one attribute, the browser performs the necessary calculations to automatically adjust the dimension along the other axis.

Note that the HEIGHT attribute is not in the HTML specification. The assumption there is that the table height is calculated by the browser to best show all cell content given either the default or attribute-established width. Because different browsers on different operating systems can render text content in varying relative font sizes, it is not unusual to let the height of a table be calculated by the browser.

Defines where (if at all) interior borders between cells are rendered by the browser. In addition to setting the table to draw borders to turn the cells into a matrix, you can also set borders to be drawn only to separate rows, columns, or any sanctioned cell grouping (THEAD, TBODY, TFOOT, COLGROUP, or COL). The BORDER attribute must be present--either as a Boolean or set to a specific border size--for any cell borders to be drawn.

A textual description of the table, including, but not limited to, instructions that nonvisual browsers might follow to describe the purpose and organization of the table data.