Re-recognize tables and an access-free data table Example _css/html

In addition to the special note, the content of this site using creative sharing authorization Signature and Non-commercial use, please respect the fruits of labor.

The form has always been a Web page design and production process an important component, in not learning CSS layout before, mostly used for layout, but to the current location found incredibly not really understand and fully grasp the table, have to need to recognize the table ...

In modern web design, the main purpose of the table should be to store multivariate two-dimensional data. Table, TR, TD, Th, TBODY, THEAD, TFOOT, col, Colgroup, caption, how to apply these labels properly? Let's start with the noun explanation.

noun explanation

Table

Display two dimensional data

Tr

A row in a table

Td

Data cells

Th

A header cell that defines a row or column of header information and cannot be used in a layout table.

Tbody

A row or rows in a table are grouped together and used in conjunction with THEAD, TFOOT

Thead

To group a row or rows in a table, use it together with Tbody, TFOOT

Tfoot

To group a row or rows in a table, use it together with Tbody, thead

Col

columns, applying specific attributes to a column or column, combined with Colgroup

Colgroup

Combination of columns, combined with COL

Caption

Define the title of the table, use it at the beginning of the table, only once

Summary

Purpose of the Description table

Example:

<table summary= "This is a demo of an affinity table" id= "Demotab" > <caption> access <a href= "http://www.forest53.com" > Www.forest53.com</a> Browser Statistics </caption> <thead> <tr> <th> Browser/month </th> <th>2005
/One </th> <th>2006/04 </th> <th>2006/05 </th> </tr> </thead> <tfoot> <tr> <th> Total </th> <td>1,646 (98.45%) </td> <td>6,978 (99.48%) </td> <td&gt
; 5,366 (99.56%) </td> </tr> </tfoot> <tbody> <tr> <th>internet explorer</th> <td>1,535 (91.81%) </td> <td>5,905 (86.41%) </td> <td>4,550 (84.42%) </td> </tr > <tr> <th>Firefox</th> <td>98 (5.86%) </td> <td>746 (10.92%) </td> &LT;TD >640 (11.87%) </td> </tr> <tr> <th>Opera</th> <td>13 (0.78%) </td> &LT;TD >147 (2.15%) </td> <td>176 (3.27%) </td&Gt </tr> </tbody> </table>