Learn how to create your Simple table with HTML5 and CSS3 Posted by Professional SEO Company in Pakistan

Necessary to organize the information, the tables are a little tricky to build in HTML: that explains that I present them only now. It will indeed be necessary to nest new HTML tags in a specific order. ProfessionalSEO Company in Pakistan wants to guide the bingers.

We will start by constructing basic tables, then we will complicate them as we go: merging cells, dividing into multiple sections ... We will also discover the CSS properties linked to tables, which will allow us to customize their appearance.

A simple table

A structured table

We learned to build small simple pictures. These small tables are sufficient in most cases, but you will need to make more complex tables.

We will discover two particular techniques:

·         For large paintings, it is possible to divide them into three parts:

·         On your mind ;

·         Body of the board;

·         Foot of table.

·         For some tables, you may need to merge cells together.

·         Divide a big painting

·         If your table is big enough, you will be interested in cutting it into several parts. For this, there are HTML tags that define the three "zones" of the table:

·         The header (at the top): it is defined with the tags <thead> </ thead>;

·         The body (in the center): it is defined with the <tbody> </ tbody> tags;

·         The foot of the table (bottom): it is defined with the <tfoot> </ tfoot> tags.

·         What to put in the foot of table? Generally, if it's a long chart, you copy the header cells to it. This allows you to see, even at the bottom of the table, what each of the columns refers to. Schematically, a table in three parts is thus cut out as illustrated.

is a bit confusing but it is advisable to write the tags in the following order:

• <    Thead     >
• <     Tfoot     >
• <     Tbody   >

In the code, we first inform the top part, then the bottom part, and finally the main part (<tbody>). The browser will display each item in the right place, do not worry. Here is the code to write to build the table in three parts:

It is not mandatory to use these three tags (<thead>, <tbody>, <tfoot>) in all tables. In fact, you will use it especially if your table is big enough and you need to organize it more clearly.

For "small" tables, you can easily keep the organization simpler than we saw at the beginning.

3, 2, 1 ... Fusioooon!

In some complex tables, you will need to "merge" cells together.

An example of a merge? Look at the table in the following figure, which lists the films and who they are talking to.

       A table containing movie titles and their audience

A table containing movie titles and their audience

For the last movie, you see that the cells have been merged: they are one. This is exactly the effect we are trying to achieve. To merge, we add an attribute to the <td> tag. It should be known that there are two types of fusion. Click on Professional SEO company in Pakistan.

Powered by: ppc expert in lahore | seo services in lahore