HTML advanced tags (1) ---- table tags, table tags

Source: Internet
Author: User

HTML advanced tags (1) ---- table tags, table tags

Using the preceding table attributes, you can create a table and cut rows and columns randomly.

<Html> 

The running result is as follows:


Note: 1. When using colspan and rowspan, you must delete the merged cells. Otherwise, the cells will be squeezed out of the table. This will no longer be demonstrated, and you will be able to understand it after a try.

2. <caption> when no specific position is set, its position moves with the position of the table.

3. After the cell is cut, you can set the display position, size, and other attributes of the cell content to make the cell content relatively consistent.



Use html tags to write a table:
<Table border = 1 width = 500>
<Tr>
<Td rowspan = 7 align = "center"> omc12 </td>
<Td> zbcx1 </td>
<Td> 5 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 4 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 6 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 8 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 3 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 2 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 1 </td>
<Td> </td>
</Tr>
<Tr>
<Td rowspan = 5 align = "center"> omc13 </td>
<Td> zbcx1 </td>
<Td> 5 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 5 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 5 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 5 </td>
<Td> </td>
</Tr>
<Tr>
<Td> zbcx1 </td>
<Td> 5 </td>
<Td> </td>
</Tr>
</Table>
How to Use HTML table labels. May you be familiar with using tables to create your homepage? 1. <table> </table> A tag pair has the following attributes for creating a table: attribute purpose <table bgcolor = ""> set table background color <table border = ""> set border width if this attribute is set, the border Width defaults to 0 <table bordercolor = ""> set border color <table bordercolorlight = ""> set the bright part color of the border (this is useful when the border value is greater than or equal to 1) <table bordercolordark = ""> set the dim part color of the border (this is useful when the border value is greater than or equal to 1) <table cellspacing = ""> set the space size between table cells <table cellpadding = ""> set the size of the space between the table cell border and its internal content <table width = ""> set the table width unit: absolute pixel value or percentage of total width Note: The preceding attributes are used in combination with the absolute pixel values for the width and size units, and the hexadecimal RGB color code or the color constant name (Silver) given by the Html language. <tr> </tr> <td> </td> <tr> </tr> A tag pair is used to create a table. Only <table> </table> labels can be placed on each row of the table. use between pairs, and adding text between these tags is useless because <tr> </tr> can only follow <td> </td> to use valid syntax for tag pairs <td> </td> A tag pair is used to create a table row with each grid. This tag pair is only valid between <tr> </tr> tag pairs. You want to enter text and only <td> </td> tags are valid only when they are displayed) <table> </table>, <tr> </tr>, and <td> </td> label pairs are shown below: <table> outer layer, create Table <tr> Create row <td> to output text can only be put here </td> Create cells (three cells are created in total) <td> the output text can only be placed here </td> <t D> the output text can only be placed here </td> </tr> </table>. In addition, <tr> the align and valign attributes are horizontally aligned with left (left aligned) center, right, valign, vertical alignment, top, middle, or bottom) <td> the unit of the width grid width with the width, colspan, rowspan, and nowrap attributes is an absolute pixel value or a percentage of the total width. The colspan attribute sets the cross-column percentage of the table lattice (default value: 1 ); rowspan sets the number of rows in the table lattice (default value: 1); nowrap disables automatic row breaking of contents in the table lattice. 3. <th> </th> the label pair is used to set the table header. Generally, the table header is in the text. See the following example. The label pairs are used. Example 6 Table labels are used in a comprehensive example.

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.