A Results Table
HTML tables allow web developers to arrange data into rows and columns.
- English Premier League Results Table
- English Football League Table
- How To Make A Results Table
- A Level Results League Table
STATISTICAL TABLES 1 TABLE A.1 Cumulative Standardized Normal Distribution A(z) is the integral of the standardized normal distribution from −∞to z (in other words, the area under the curve to the left of z). It gives the probability of a normal random variable not being more than z standard deviations above its mean. Tablearrays store column-oriented or tabular data, such as columns from a text file or spreadsheet. Tables store each piece of column-oriented data in a variable. Table variables can have different data types and sizes as long as all variables have the same number of rows. Table variables have.
Example
| Company | Contact | Country |
|---|---|---|
| Alfreds Futterkiste | Maria Anders | Germany |
| Centro comercial Moctezuma | Francisco Chang | Mexico |
| Ernst Handel | Roland Mendel | Austria |
| Island Trading | Helen Bennett | UK |
| Laughing Bacchus Winecellars | Yoshi Tannamuri | Canada |
| Magazzini Alimentari Riuniti | Giovanni Rovelli | Italy |
Define an HTML Table
The <table> tag defines an HTML table.
Each table row is defined with a <tr> tag. Each table header is defined with a <th> tag. Each table data/cell is defined with a <td> tag.
By default, the text in <th> elements are bold and centered.
By default, the text in <td> elements are regular and left-aligned.
Example
A simple HTML table:
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Note: The <td> elements are the data containers of the table.
They can contain all sorts of HTML elements; text, images, lists, other tables, etc.
HTML Table - Add a Border
To add a border to a table, use the CSS border property:
Example
Try it Yourself »Remember to define borders for both the table and the table cells.
HTML Table - Collapsed Borders
To let the borders collapse into one border, add the CSS border-collapse property:
Example
border: 1px solid black;
border-collapse: collapse;
}
HTML Table - Add Cell Padding
Cell padding specifies the space between the cell content and its borders.
If you do not specify a padding, the table cells will be displayed without padding.
To set the padding, use the CSS padding property:
English Premier League Results Table
Example
Try it Yourself »HTML Table - Left-align Headings
By default, table headings are bold and centered.
To left-align the table headings, use the CSS text-align property:
Example
Try it Yourself »HTML Table - Add Border Spacing
Border spacing specifies the space between the cells.
To set the border spacing for a table, use the CSS border-spacing property:


Example
Try it Yourself »Note: If the table has collapsed borders, border-spacing has no effect.
HTML Table - Cell that Spans Many Columns
To make a cell span more than one column, use the colspan attribute:
Example
<tr>
<th>Name</th>
<th colspan='2'>Telephone</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>55577854</td>
<td>55577855</td>
</tr>
</table>
HTML Table - Cell that Spans Many Rows
To make a cell span more than one row, use the rowspan attribute:
Example
<tr>
<th>Name:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan='2'>Telephone:</th>
<td>55577854</td>
</tr>
<tr>
<td>55577855</td>
</tr>
</table>
HTML Table - Add a Caption
To add a caption to a table, use the <caption> tag:
Example
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$50</td>
</tr>
</table>
Note: The <caption> tag must be inserted immediately after the <table> tag.
A Special Style for One Table
To define a special style for one particular table, add an id attribute to the table:

Example
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Now you can define a special style for this table:
width: 100%;
background-color: #f1f1c1;
}
And add more styles:
background-color: #eee;
}
#t01 tr:nth-child(odd) {
background-color: #fff;
}
#t01 th {
color: white;
background-color: black;
}
Chapter Summary
- Use the HTML
<table>element to define a table - Use the HTML
<tr>element to define a table row - Use the HTML
<td>element to define a table data - Use the HTML
<th>element to define a table heading - Use the HTML
<caption>element to define a table caption - Use the CSS
borderproperty to define a border - Use the CSS
border-collapseproperty to collapse cell borders - Use the CSS
paddingproperty to add padding to cells - Use the CSS
text-alignproperty to align cell text - Use the CSS
border-spacingproperty to set the spacing between cells - Use the
colspanattribute to make a cell span many columns - Use the
rowspanattribute to make a cell span many rows - Use the
idattribute to uniquely define one table
HTML Exercises
HTML Table Tags
English Football League Table
| Tag | Description |
|---|---|
| <table> | Defines a table |
| <th> | Defines a header cell in a table |
| <tr> | Defines a row in a table |
| <td> | Defines a cell in a table |
| <caption> | Defines a table caption |
| <colgroup> | Specifies a group of one or more columns in a table for formatting |
| <col> | Specifies column properties for each column within a <colgroup> element |
| <thead> | Groups the header content in a table |
| <tbody> | Groups the body content in a table |
| <tfoot> | Groups the footer content in a table |
For a complete list of all available HTML tags, visit our HTML Tag Reference.