Welcome to the html tutorial, we already covered the basics of html, today we will talk about html table syntax. Before jumping on syntax, let’s see what exactly table is in html. It is better to clear points, instead of having confusion.
Html table – definition
Html table is nothing but it is a way of creating rows and columns on web pages. It will help you to present data into a table format. You can use a table to arrange text, images, form fields, links and tables inside tables.
In the table there many elements that play important part, let’s see the elements:
- Caption(<caption>) tag – It will define a table caption, and can be used just after <table> tag. You can use it only once per table.
- Rows( <tr> tag) – Defines a row in a table
- Cells(<td> tag) – Defines a cell in a table
- Header( <th> tag) – Can be used for table heading.
Don’t worry, we will explain above tag’s in html table syntax, that means in the next paragraphs.
Note: You can use thead, tbody and tfoot elements in organized rows into a head, foot and body sections.
Html table Syntax
Now we will see the html table syntax, the main tag is <table>, inside it you will use <tr>, <td> tags and other tags . You can have any number of rows or columns as per the need. Once you will finish working on table content, never forget to close it with </table> tag. Let’s see how the tags together will look like:
<table> <tr> <td> </td> </tr> </table>
HTML table syntax – practical use
Now we know what is table syntax, the next thing we will do is see how to use them in a practical way. For that, let’s create 2 X 2 matrix, In the example we will create two rows and two columns to understand the basic uses of the table.
<html> <head> <title> Use of syntax – by sharplesson</title> </head> <body> <table border=1> <tr> <td> first column </td> <td> Second column</td> </tr> <tr> <td> first column </td> <td> Second column</td> </tr> </table> </body> </html>
The output of the above code will be:
We have just set the border to 1 and the rest are very much clear, how <tr> and < td> tags have been used.
Note: you can use border or other table properties to give a presentable look to your table.
Conclusion
We have just covered html table syntax and its basic example, html is an easy to learn language, Still practice is needed and hopefully you will not run from it.