Tables can be difficult at first, but with a little patience and practice you will se that things are not always how they seem to be. The <table> tag is used to open a table.
Within this tag we will find two others typical tags, <tr> the table lines & <td> the table column
Input
<table border="1"> <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>
Output
The content will be placed within the table's rows. A row represents what is between <td> and </td> The border attribute establishes the length of the table's edge.
HTML: Asymmetrical tables
To form asymmetrical tables we will use rowspan to cross more than one line and colspan to cross more than one columns.
Also, if we want that the first line to serve as titles line for all the columns we will use the <th> tag. These will be written with bold letters as we will see in the following example:
Input
<table border="1"> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr<>td rowspan="2"<Row 1 Cell 1</td> <td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr> <tr><td>Row 2 Cell </td><td>Row 2 Cell 3</td></tr> <tr><td colspan="3">Row 3 Cell 1</td></tr> </table>
Output
Within this tag we will find two others typical tags, <tr> the table lines & <td> the table column
Input
<table border="1"> <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>
Output
| Row 1 Cell 1 | Row 1 Cell 2 |
| Row 2 Cell 1 | Row 2 Cell 2 |
The content will be placed within the table's rows. A row represents what is between <td> and </td> The border attribute establishes the length of the table's edge.
HTML: Asymmetrical tables
To form asymmetrical tables we will use rowspan to cross more than one line and colspan to cross more than one columns.
Also, if we want that the first line to serve as titles line for all the columns we will use the <th> tag. These will be written with bold letters as we will see in the following example:
Input
<table border="1"> <tr> <th>Column 1</th> <th>Column 2</th> <th>Column 3</th> </tr> <tr<>td rowspan="2"<Row 1 Cell 1</td> <td>Row 1 Cell 2</td><td>Row 1 Cell 3</td></tr> <tr><td>Row 2 Cell </td><td>Row 2 Cell 3</td></tr> <tr><td colspan="3">Row 3 Cell 1</td></tr> </table>
Output
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| Row 1 Cell 1 | Row 1 Cell 2 | Row 1 Cell 3 |
| Row 2 Cell 2 | Row 2 Cell 3 | |
| Row 3 Cell 1 | ||