Home > Web Front-end > HTML Tutorial > HTML language analysis table markup

HTML language analysis table markup

黄舟
Release: 2016-12-15 13:15:36
Original
1277 people have browsed it

it can be said that only learning these three is enough.>
is a container tag, which means that it is used to declare that this is a table and other table tags can only be applied within its scope. There are other container tags.
Used to mark table columns (rows)
Used to mark cells (cells)
Parameter settings (commonly used):
For example:


width="400"
Table width, accepts absolute values ​​(such as 80) and relative values ​​(such as 80%).

border="1"
Table border thickness, different browsers have different default values, so please specify.

cellspacing="2"
Table grid line thickness, please see example 3, that is a grid line thickened to 5.

cellpadding="2"
The distance between the text and the grid, please see example 4, that is the padding added to 10.

align="center"
The placement position (horizontal) of the table, the optional values ​​are: left, right, center, please see example 5 or 6, the table is placed in the middle, for fear that some browsers do not support it , so the center mark
is added, which is just a multi-layered guarantee. Of course, only
can also be used.

valign="top".
The placement position (vertical) of calligraphy and painting in the table, the optional values ​​are: top, middle, bottom.

background="myweb.gif"
Form paper, do not use it with bgcolor.

bgcolor="#0000ff"
Form background color, do not use it with background. Please see Example 6.

bordercolor="#ff00ff"
Table border color, nc and ie have different effects, please see example 6.

bordercolorlight="#00ff00"
The color of the light facing part of the table border, please see example 2. 『Only applicable to ie』

bordercolordark="#00ffff"
The color of the backlight part of the table border, please see example 2. When using bordercolorlight or bordercolordark, bordercolor will be invalid. 『Only applicable to ie』

cols="2"
The number of table fields only allows the browser to draw the entire table before downloading the table.
Parameter settings (commonly used):
For example:
align="right"
The placement position (horizontal) of calligraphy and painting in this column. Optional values ​​are: left, center, right.

valign="middle"
The placement position (vertical) of calligraphy and painting in this column, the optional values ​​are: top, middle, bottom.

bgcolor="#0000ff"
For the background color of this column, please see example 5.

bordercolor="#ff00ff"
For the border color of this column, please see Example 3. 『Only applicable to ie』

bordercolorlight="#808080"
The color of the light-facing part of the border in this column, please see example 3. 『Only applicable to ie』

bordercolordark="#ff0000"
The color of the backlight part of the border in this column, please see example 3. When using bordercolorlight or bordercolordark, bordercolor will be invalid. 『Only applicable to ie』

align="top"
The table title column is relative to the table The placement position (horizontal) of the post, the optional values ​​are: left, center, right, top, middle, bottom. If align="bottom" is used, the title column will appear below the table, regardless of the position in your source code.
Parameter settings (commonly used):
For example:

width="48%"
This one is saved Grid width, accepts absolute value (such as 80) and relative value (such as 80%).

height="400"
The height of the cell.

colspan="5"
The number of columns that the cell opens to the right. Please look at Example 6

rowspan="4"
The number of columns that can be opened downwards in this cell. Please see Example 6

align="right"
The placement position (horizontal) of the calligraphy and painting in this cell, the optional values ​​are: left, center, right.

valign="bottom"
The position (vertical) of the placement of calligraphy and painting in this cell, the optional values ​​are: top, middle, bottom.

bgcolor="#ff00ff"
For the background color of this cell, please see Example 4.

bordercolor="#808080"
The color of the cell border, please see example 3. 『Only applicable to ie』

bordercolorlight="#ff0000"
The color of the light-facing part of the cell border, please see example 3. 『Only applicable to ie』

bordercolordark="#00ff00"
The color of the backlight part of the cell border, please see example 3. When using bordercolorlight or bordercolordark, bordercolor will be invalid. 『Only applicable to ie』

background="myweb.gif"
This grid paper can be used with either bgcolor.
Example 1:
Source code
A table with only one cell

Display results

A table with only one cell
Example 2:
Source code


Display results

First column, first column, first column, second column
Example 3:
Source code
First column, first columnFirst column, second column

< tr bordercolor="#0000ff">



< tr bordercolorlight="#ff00ff" bordercolordark="#00ff00">


< /tr>
First column, first columnFirst column, second column
Second column, first columnSecond column, second column

Display results

First column, first column, First column, second column
Second column, first column, Second column, second column
Example 4:
Source code







First column, first columnFirst column, second column
Second column, first column
Second column, second column

Display results

First column, first column Column 2
Column 2 1 Column 2 Column 2
Example 5:
Original code








< td>Second column, first column


First column, first columnFirst column, second column ColumnFirst column, third column
Second column, second columnSecond column, third column


Display results

First column, first column, First column, second column, First column, third column
Second column, first column, Second column, second column Second column and third column
Example 6
Source code














First column, first columnFirst column, second column and third column Column
The first column of the second and third columnsNo. Two columns, second columnSecond column, third column
Third column, second column< /td>
Third column, third column


Display results

First column, first column, first Column 2 and Column 3
Column 2 and Column 3 1st Column 2nd Column 2nd Column 2nd Column 3rd Column
The third column, the second column, the third column, the third column
:

and both mark a cell, the only difference is the cell marked by The text in appears in bold and is usually used in the first column of a table to identify columns. Its usage is to replace the position of . Please refer to for its parameter settings.
Of course, if you add a bold mark to the text in the cell marked by
, it will have the same effect as .
Example:
Source code













month% of ie visitor% of nc visitor
august61%39%
july54%46%
june52%48%

Show results

month % of ie visitor % of nc visitor
august 61% 39%
july 54% 46%
june 52% 48%
:

is used for The table is marked with a title column, which is like adding a ruled column above the table. Of course, it can also be placed below, which is usually used to store the title of the form.
Parameter settings (commonly used):
For example:
placed at the head or tail of a .

valign="top"
The position (top and bottom) of the table title column relative to the table. Optional values ​​are: top, bottom. It is the same as align="top" or align="bottom". Although the functions are repeated, if you want the title bar to be placed below and pasted to the right or left, then the two parameters can be used together. When there is only one parameter, please prefer align, because valign is a parameter only started in html 3.0.
Example:
Source code











august 61% 39%

The above is the content of HTML language analysis table markup. For more related articles, please pay attention to the PHP Chinese website (www.php.cn)!



Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
Webpage Express August Visitor browser usage analysis
month% of ie visitor% of nc visitor
august61%