Recognition of tables and an accessible data table example _ CSS/HTML

Recognition of tables and an example of a data table with no access restrictions, in addition to special instructions, the content on this site uses the creation and sharing authorization Signature and non-commercial use, Please respect the fruits of labor.

Tables have always been an important part of the web design and production process. Before learning CSS layout, most of them are used for layout, however, the current location does not really understand and fully understand the table, and you have to re-recognize the table ......

In modern web design and production, tables are mainly used to store multi-dimensional data. Table-related labels include table, tr, td, th, tbody, thead, tfoot, col, colgroup, and caption. How can we reasonably apply these labels? Start with glossary.

Glossary table

Display 2D data

Tr

A row in the table

Td

Data Cell

Th

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

Tbody

A row or multiple rows in a table must be grouped in combination with thead and tfoot.

Thead

Combine tbody and tfoot to group one or more rows in a table.

Tfoot

Combine tbody and thead to group one or more rows in the table.

Col

Apply specific attributes to one or more columns, and use them together with colgroup.

Colgroup

Combination of columns, used together with col

Caption

Defines the table title, which is used only once at the beginning of the table.

Summary

Describe the purpose of the table

Example:

 
 

  
  

    Visit www.forest53.com browser statistics 
  
  
  
 
   
 
    
Browser/month
 
    
2005/11
 
    
2006/04
 
    
2006/05
 
   
 
  
  
  
 
   
 
    
Total
 
    
1,646 (98.45%)
 
    
6,978 (99.48%)
 
    
5,366 (99.56%)
 
   
 
  
  
  
 
   
 
    
Internet Explorer
 
    
1,535 (91.81%)
 
    
5,905 (86.41%)
 
    
4,550 (84.42%)
 
   
 
   
 
    
Firefox
 
    
98 (5.86%)
 
    
746 (10.92%)
 
    
640 (11.87%)
 
   
 
   
 
    
Opera
 
    
13 (0.78%)
 
    
147 (2.15%)
 
    
176 (3.27%)