UP TO 30 % OFF for licences and upgrades!

One of the available resources is the structure or the tab information in table format. A table consists of a frame, which can have a title, divided into lines, where each line is divided into columns. The intersection (or meeting) of a line with a column produces a unit of information, which is commonly called cell.

Tables offer interesting features to the HTML markup language, especially as regards to organization of layouts. However, we have to be aware and take care not to turn everything we have into tables. It is important to remember that HTML is a language for structuring content, not necessarily for formatting or “makeup”.

Tables should be used when we need tabular data in the form of a grid. The initial tag which marks the beginning of a table is the <table> tag, and it is the container type, ie, it should only be closed when the structure of the table is complete. Optionally, you can use the <caption> tag to set a title or description to a table. The caption is displayed before the frame in a centralized way.

The next step is to define the lines contained in the table. For that, the <tr> tag (table row) will be used. This is also a container tag whose contents will be composed of other tags. Each set of <tr> tags should be divided into columns. To do this, we employ the <td> tag (table data). It is between the opening and closing of the <td> tag that the data will be reported.

The data is informed exclusively between the <td></td> tags. By default, the table has no dividing lines between cells. To display the lines, you must use the parameter border (edge) with the <table> tag as follows: <table border=”1″>.

The HTML language also allows tables to be nested, i.e., within a cell content, instead of entering data itself, a new table is declared. This type of resource allows us to explore some interesting situations.

Also in relation to the tables, there is a special tag type whose use is the same as the <td> tag: it is the <th> (table header). This tag aims to indicate that this cell contains a header information for the other cells. It is usually used in the first row cells when they contain headers (titles) of the columns.

Finally, to merge cells in the same line, you must use the colspan parameter (indicating the line number of columns that will be merged). In situations where it is necessary to merge entire rows, you must use the rowspan parameter, indicating how many lines will be merged.

HTML Tables

You might also like…

Deep Data: Is it possible when you’re non-profit?

Evan Liebovitch talks about deep data and how to document the needs of a non-profit while using Scri...

Deep Data: Creating Powerful Large Systems

Creating powerful large systems to support business processes in a cost-effective and accessible man...

How to recognize business models and processes from Deep Data Perspective

Listen to the podcast and learn how to recognize business models and processes from Deep Data Perspe...

Comment this post

Get new posts, resources, offers and more each week.