Introduction to tables:
Html Table Code is so simple. The HTML table model allows authors to arrange data — text, preformatted text, images, links, forms, form fields, other tables, etc. — into rows and columns of cells.
Each table may have an associated caption (see the CAPTION element) that provides a short description of the table’s purpose. A longer description may also be provided (via the summary attribute) for the benefit of people using speech or Braille-based user agents.
Table rows may be grouped into a head, foot, and body sections, (via the THEAD, TFOOT and TBODY elements, respectively). Row groups convey additional structural information and may be rendered by user agents in ways that emphasize this structure. User agents may exploit the head/body/foot division to support scrolling of body sections independently of the head and foot sections. When long tables are printed, the head and foot information may be repeated on each page that contains table data.
Authors may also group columns to provide additional structural information that may be exploited by user agents. Furthermore, authors may declare column properties at the start of a table definition (via the COLGROUP and COL elements) in a way that enables user agents to render the table incrementally rather than having to wait for all the table data to arrive before rendering.
Table cells may either contain “header” information (see the TH element) or “data” (see the TD element). Cells may span multiple rows and columns. The HTML 4 table model allows authors to label each cell so that non-visual user agents may more easily communicate heading information about the cell to the user. Not only do these mechanisms greatly assist users with visual disabilities, they make it possible for multi-modal wireless browsers with limited display capabilities (e.g., Web-enabled pagers and phones) to handle tables.
Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.
Html Table Code :
Html table consists of the following tag:
- Tables are defined with the <table> tag.
- A table is divided into rows with the <tr> tag, and each row is divided into data cells with the <td> tag.
- The letters td stands for “table data”, which is the content of a data cell.
- A data cell can contain text, images, lists, paragraphs, horizontal rules, tables, etc.
- Headings in a table are defined with the <th> tag.
Html Table Code :
Html Table Code Output :
Why table in html?
We use tables all the time to represent data sets. A spreadsheet is a table. It is a worksheet with columns and rows. Columns have headings and everything under them is associated with those headings. Likewise, rows can have headings so that everything in that row is associated with those headings.
Html Table Code :
HTML tables can be made to perform the exact same function.
Tables have been and still are used in some layouts to contain content, not data as such. This has been on ongoing discussion for years. Is it good? Or is it bad? I won’t get into the pro’s and con’s, but I do favor CSS layouts to table layouts. Your reading will uncover lots of differing opinions on the topic.
Focusing on arrangement of data is a good place to plant yourself and explore. Study up on best practice for data tables so you get introduced to all the concepts, not just what is introduced here.