Webpage Workshop: Home » HTML language reference » Table


This element is used to define a table for representing tabular data. Tables consist of rows, header cells and data cells. They can also have one of each of the optional header, body, footer and caption elements.

    align="center | left | right"**
    bgcolor="color name | #rrggbb"**
    class="class name(s)"
    dir="ltr | rtl"
    frame="above | below | border | box | hsides | lhs | rhs |
           void | vsides"
    id="unique identifier"
    lang="language code"
    rules="all | cols | groups | none | rows"
    style="style information"
    width="percentage | pixels"

‡ = Required attribute
** = Transitional only

Explanation of attributes

align**: used to specify the horizontal alignment of the element with respect to the page. The default value is "left".

bgcolor**: used to define the color in which the background of the table should be rendered. This attribute can be either the name of a color (support varies) or a color code. Deprecated in favor of stylesheets.

border: used to specify the thickness of the border that surrounds the table; this should be a value in pixels. The default value is 0.

cellpadding: this attribute is used to specify the padding between the cell edge and its contents.

cellspacing: this attribute is used to specify the distance between individual cells in the table.

class: used to state which class(es) the element belongs to. It is possible to indicate more than one class for an element by separating each class name with a space character. This attribute is normally used in combination with a stylesheet in order to associate the elements with particular styles defined within the stylesheet.

dir: used to set the direction of the text in combination with the language set in the lang attribute. The available values are "ltr" (left to right) and "rtl" (right to left), with the default value being "ltr".

frame: this attribute denotes which sides of the table's outside border are displayed. The value void is used for no border, above for only a top border, below for only a bottom border, hsides shows only the left and right borders only, vsides shows only the top and bottom borders, lhs for only a left border, and rhs for only a right border. Both the values box and border display a border on all sides.

id: used to specify a unique alphanumeric identifier to the element. This is usually used in combination with stylesheets in order to apply a style to one particular instance of an element. Only one element, regardless of type, can be given a particular id.

lang: used to indicate the language being used in the text contained within the element. The value of this attribute takes on the form of the ISO standard lanuage abbreviations found in RFC 3066. A list of these codes can be found on the ISO language codes page.

rules: this attribute is used to specify the borders that are displayed between cells. The value none is used to display no inner borders, groups for borders only between row groups and column groups, rows for borders only between rows, cols for borders only between columns, and lastly the value all displays borders between all the cells.

style: used to specify an inline style to apply to the element. The styles defined here override the styles declared in the header section.

summary: this is used to provide a textual summary of the table. It should contain information about the purpose of the data and/or the structure of the table.

title: used to define an advisory text that may be displayed as a tooltip when a mouse is used to hover over the element.

width: used to specify the width of the element in pixels, when the value is a number, or when the value is followed by the % symbol it denotes a percentage of the available page canvas to use as a width.

Event handlers

The following event handlers are defined for this element:


Description: Support of table and attributes in various browsers
Test Internet Explorer 6+ Netscape 4 Mozilla and Netscape 6+ Opera 6+ MSN TV (WebTV) Konqeuror 3.0+
Basic element support  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: align  Yes  Yes  Yes  Yes  Yes 
Attribute: bgcolor  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: border  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: cellpadding  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: cellspacing  Yes  Yes  Yes  Yes  Yes  Yes 
Attribute: class  Yes  Yes  Yes  Yes  Yes 
Attribute: dir  Yes  Yes  No  No  No 
Attribute: frame  Yes  No  Yes  Yes 
Attribute: id  Yes  Yes  Yes  Yes  Yes 
Attribute: lang  Yes  No  Yes  No  No  No 
Attribute: rules  Yes  No  Yes  Yes 
Attribute: style  Yes  No  Yes  Yes  Yes  Yes 
Attribute: summary  No  No  Yes  No  No 
Attribute: title  Yes  No  Yes  Yes  No  Yes 
Attribute: width  Yes  Yes  Yes  Yes  Yes  Yes 

The browser icons are explained in the below list:
Internet Explorer 6+ = Microsoft Internet Explorer 6+
Netscape 4 = Netscape Communicator 4
Mozilla and Netscape 6+ = Mozilla and Netscape Navigator 6+
Opera 7+ = Opera 7+
MSN TV (WebTV) = MSN TV (aka. WebTV)
Konqeuror 3.0+ = Konqueror 3.0+