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

Source: Internet
Author: User
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>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.