The column is one of the two structural elements of a table, whether an HTML table, or the table used in databases. Together with the rows, columns allow for the contents of a table to be organized in an easy to understand and use way.
Columns in HTML tables
In the context of HTML, the column refers to the vertical line of cells containing the information presented in a table. Each cell within a table column may contain various type of information like text, paragraphs, images, lists, links, forms, etc. That means you can place different page content elements within a single table column, depending on what you want to be presented on the screen.
As a piece of the HTML code, the table column is marked with a <COL> tag where COL is an abbreviation of 'column'. In contrast to the <TR> tag, <COL> does not have a structural function, it is only used to define certain style properties for all cells in one or more columns within a table. To set apart a column within the HTML syntax of a table you need to just begin it with <COL>, no end tag </COL> is necessary. The <COL> tag may be placed directly as an attribute for the <TABLE> tag or it may be an attribute of the <COLSGOUP> tag (structural function).
The example below demonstrates how the block of code for a 3-column table should look like.
Example of a table containing columns, each begun by the <COL> tag:
<table width="100%" border="1"><col align="left"></col>
<col align="left"></col>
<col align="right"></col>
<tr>
<th>ID</th>
<th>Title</th>
<th>Price</th>
</tr>
<tr>
<td>3476896</td>
<td>Hand coding pixel-precise PSD conversion to W3C Valid CSS / HTML</td>
<td>$50 per hour</td>
</tr>
<tr>
<td>2489604</td>
<td>CSS / XHTML implementation into skins, themes, CMS, shopping carts and more</td>
<td>$77 per hour</td>
</tr>
</table
Example of how the same 3-row table will appear in a browser:
| ID | Title | Price |
|---|---|---|
| 3476896 | Hand coding pixel-precise PSD conversion to W3C Valid CSS / HTML | $50 per hour |
| 2489604 | CSS / XHTML implementation into skins, themes, CMS, shopping carts and more | $77 per hour |
<COL> attributes
The data cell style properties that the <COL> tag defines are specified with the help of special column attributes:
SPAN attribute
a general attribute, defining the number of columns that the<COL>’s style attributes will be applied to. Its default value is 1 i.e. the style properties defined by the other COL attributes will be applied to the cells in one column only, unless a bigger value is specified;
WIDTH attribute
style attribute, specifying the width of a column. Its value can be expressed in three ways - in pixels, in i* (a relative integer value), or as a percentage of the whole table width. If, for example, a column has WIDTH="0*", then it will be as wide as its contents allow.
ALIGN attribute
a style attribute, defining the horizontal alignment for each cell in a column. This attribute may take various values including left (for left alignment), center (for centered alignment), left (for left alignment), justify (for bilateral alignment) and char (for alignment to the character specified in the CHAR attribute).
VALIGN attribute
a style attribute, specifying the vertical alignment for each cell within a column. There are a few possible positions defined by the VALIGN attribute - top (the cell contents are placed at the top of the cell), middle (the cell data is centered vertically), bottom (the date is located at the cell’s bottom) and baseline (the first line of all cells in a column should be equally aligned).
Columns in databases
Since tables can also be used to store and organize the information in databases, we can talk about database table columns as well. In the context of databases, a column represents a single vertical line of data cells in a table, while rows refer to the horizontal lines of data cells in the same table. All columns within a table are characterized by identical structure and you can have as many of them as you need. Each column defines the type of data that will be stored in the database cells.