Web pages are carriers of information. In order to organize a large amount of data and information conveniently and quickly, tables are often used Web page production It is very important. Now many web pages use multiple tables for layout, because tables can not only fix the output of text or images, but also set the background color and foreground color arbitrarily.
The following describes the display form of the basic table:
<TABLE>...</ TABLE>Tag pairs are used to create tables. The basic elements of a table consist of the following four parts:
·<TABLE>...</ TABLE>defines the table area.
·<TR>... </ TR>Define table rows.
·<TH>...</ TH>Define header row cells, or<TD></ TD>Define Data Cells.
·<CAPTION>...</ CAPTION>Define the table title.
To create a basic table, you can use the following HTML code.
<TABLE>
<CAPTION>Table title text<CAPTION>
<TR>
<TH>Title</TH><TH>Title</TH>< TH>Title</TH>
<TR>
<TR>
<TD>Data</TD><TD>Data</TD...<TD>Data</TD>
<TR>
...
</TABLE>
General<TH>< TH>and<CAPTION></ CAPTION>tags are optional, but the other 3 pairs of tags are mandatory.
<CAPTION>Place tag in<TABLE></ TABLE>Between tag pairs and before the table row is marked, it can use the align attribute to determine whether the table title is placed above or below the table.
·align=top； The title is placed above the table and centered (the default value).
·Align bottom: the title is placed at the bottom of the table and centered.
Note: Tables can be nested with each other, but cannot be cross nested.
[Example 1-1] Design a basic table (1-1. htm) with three rows and four columns, including table title (<CAPTION>) and table title row (<TH>). The table effect is shown in Figure 1-1
<HTML>
<HEAD><TITLE>Basic table</TITLE></HEAD>
<BODY>
<TABLE width="80%" height="82" border="1" align="center">
<CAPTION>Student Information Sheet</CAPTION>
<TR><TH>Name</TH><TH>Gender</TH><TH</TH>Age</TH><TH>Remarks</TH></TR>
<TR><TD>Wang Lin's "/TD><TD>Male</TD><TD>20</TD><TD>Outstanding League Member</TD></TR>
<TR><TD>Zhao Yun</TD><TD>Female</TD><TD>24</TD><TD>Three Good Students</TD></TR>
</TABLE>
</BODY>
</HTML>
