Using Tables
Tables are defined with the <table> tag.
Each row of a table is contained in the <tr></tr>
tags.
Within each row, individual cells are contained within the
<td></td> tags.
For example:
<table border="1" summary="test
Table">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Add this to your example web page like so:
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Welcome to My Page!</h1>
<hr />
<h3>This is my very first web page.</h3>
<p>Not bad for a first attempt.<br />
I can also introduce line breaks</p>
<p><strong>This is bold
text</strong></p>
<p><em>This is italic text</em></p>
<p><strong><em>This is bold, italic, text</em></strong></p>
<h3>This is a table</h3>
<table border="1" summary="test
Table">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
</body>
</html>
The Border Attribute
This specifies the width of the table border.
Try changing your border attribute to:
border="0"
A setting of zero causes the border to disappear. You can achive the same effect by simply removing the border attribute altogether.
For example:
<table>
Now try setting it to:
border="3"
This will create a much thicker border
The Summary Attribute
This provides highly useful information for people who maybe reading your page via a text-to-speech reader. The summary attribute should reflect the information content of your table.
Headings in a Table
You can provide automatically formatted headings in a table
by using the <th></th> tags.
For example:
<table border="1" summary="Yet Another
Test Table">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
Add this to your example web page like so:
<html>
<head>
<title>My First Page</title>
</head>
<body>
<h1>Welcome to My Page!</h1>
<hr />
<h3>This is my very first web page.</h3>
<p>Not bad for a first attempt.<br />
I can also introduce line breaks</p>
<p><strong>This is bold
text</strong></p>
<p><em>This is italic text</em></p>
<p><strong><em>This is bold, italic, text</em></strong></p>
<h3>This is a table</h3>
<table border="1" summary="test
Table">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
<p><br /></p>
<table border="1" summary="Yet Another
Test Table">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
</body>
</html>