HTML Table Tag Tutorial (47): Nested Tables
|
<br />In the page, typesetting is achieved by nesting tables. That is, one table can be nested inside another table. Here are the reasons: First of all, the layout of the web page will be very complicated, and an external table is needed to control the overall layout. If some internal layout details are also implemented through the master table at this time, it is easy to cause conflicts in row height and column width, which will bring difficulties to table production. Secondly, when the browser parses the web page, it will display the table only after downloading the entire table structure. Without nesting, the table would be very complex and visitors would have to wait a long time before they could see the content of the web page. For these reasons, nested tables were introduced. The main table is responsible for the overall layout, and the nested table is responsible for the layout of each sub-column and is inserted into the corresponding position of the main table. In this way, everyone can perform their duties and there will be no conflict. File example: 10-47.htm Make tables nested. 01 <!-- ------------------------------ --> 02 <!-- File example: 10-47.htm --> 03 <!-- File description: nested tables --> 04 <!-- ------------------------------ --> 05 <html> 06 <head> 07 <title>Nested tables</title> 08 </head> 09 <body> 10 <table border=3 width=400 height=100 bordercolor=#336699 align="Center"> 11 <tr> 12 <td colspan=2 align="Center"> 13 <table border=1 width=100% bordercolor=red> 14 <tr> 15 Macromedia Web Designer 16 </tr> 17 <tr> 18 <td align="Center">Web design software</td> 19 </tr> 20 </tableE> 21 </td> 22 </tr> 23 <tr> 24 <td>Web Graphics Software</td><td>Fireworks</td> 25 </tr> 26 <tr> 27 <td>Web page creation software</td><td>Dreamweaver</td> 28 </tr> 29 <tr> 30 <td>Web animation software</td><TD>Flash</td> 31 </tr> 32 </table> 33 </body> 34 </html> The file description shows that lines 13 to 20 are nested tables. |
<<: A brief discussion on VUE uni-app's commonly used APIs
>>: Implementation steps of Mysql merge results and horizontal splicing fields
Recommend
Example tutorial on using the sum function in MySQL
Introduction Today I will share the use of the su...
The complete code of the uniapp packaged applet radar chart component
Effect picture: The implementation code is as fol...
Let's learn about JavaScript object-oriented
Table of contents JavaScript prototype chain Obje...
Search engine free collection of website entrances
1: Baidu website login entrance Website: http://ww...
The complete version of the common Linux tool vi/vim
Why learn vim Linux has a large number of configu...
Detailed explanation of html download function
The new project has basically come to an end. It ...
Detailed tutorial on installing SonarQube using Docker
Table of contents 1. Pull the image 1.1 Pull the ...
Add ico mirror code to html (favicon.ico is placed in the root directory)
Code: Copy code The code is as follows: <!DOCTY...
JavaScript basics for loop and array
Table of contents Loop - for Basic use of for loo...
MySQL 8.0.23 Major Updates (New Features)
Author: Guan Changlong is a DBA in the Delivery S...
Detailed explanation of the process of zabbix monitoring sqlserver
Let's take a look at zabbix monitoring sqlser...
Deploy Confluence with Docker
1. Environmental requirements 1. Docker 17 and ab...
Comparison of the use of form element attributes readonly and disabled
1) Scope of application: readonly:input[type="...
Solve the problem of secure_file_priv null
Add secure_file_priv = ' '； then run cmd ...
Docker compose deploys SpringBoot project to connect to MySQL and the pitfalls encountered
Earlier, we used Docker to simply deploy the Spri...