Hello, and welcome to the next unit of our HTML course series titled HTML Tables. In this course, we are going to learn how to insert tables in our websites. We would look at the this in three sections:
- Tables Tags,
- The Table Header, and
- The Table Border.
HTML Table Tags
Just as all other elements use tags in HTML, so does tables. Tables use the following tags:
|<table></table>||For Defining a table|
|<tbody></tbody>||For Defining the body of a table|
|<tr></tr>||For Defining the row of a table|
|<th></th>||For defining a table header|
|<td></td>||For Defining a table data|
The code for inserting tables like the one you see above can be written this way;
<table border="1"> <tbody> <tr> <th>Phones</th> <th>Computers</th> </tr> <tr> <td>Samsung</td> <td>HP</td> </tr> <tr> <td>HTC</td> <td>Acer</td> </tr> </tbody> </table>
The HTML Tables Header
The table header uses the <th></th> tag. As you can see, using the header tag made the headings to be written in bold. To omit the header in your table, remove the <th> tag or change it to a <td></td> (table data) tag.
The HTML Tables Border
The table border uses the attribute “border”. the value “1” refers to the thickness of the border. To get a thicker border, you can increase it to 2 ,3, or even 5 depending on the size you want.
OK! So we are done with HTML Tables too. Please don’t forget to copy the code, paste it in your html editor and try customizing to your own specification to see how it works. … and don’t forget to wrap it in the <html></html> tags. Post your customized codes in the forum for others to check them out too. See you in the next lesson.