的标准规则。和| 元素。
格式化嵌套表格与 HTML 的任何其他元素一样简单且相似。
上面的示例有主容器、一个两列的表格和一个两行两列的嵌套表格。
现在观察下面的嵌套表示例。我们讨论了上面嵌套级别的解释，我们将尝试通过下面的编码创建这样一个示例。
代码：
<body>
<table border="10" bordercolor = "#0B1941">
<tr>
<td>
<table border="10" bordercolor = "#F8F3F3">
<tr>
<td>
<table border="10" bordercolor = "#C74D4F">
<tr>
<td>
<table border="10" bordercolor = "#DCE127">
<tr>
<td>
<table border="10" bordercolor = "#3CAB16">
<tr> <td> </td> </tr>
</table> </td> </tr>
</table> </td> </tr>
</table> </td> </tr>
</table> </td> </tr>
</table>
上面的代码输出以下显示，显示通过不同颜色区分的表的 5 层嵌套。观察表格彼此内部的放置情况，即嵌套在：
当程序员使用表格来格式化整个网页时，表格内嵌套的概念在视觉上变得更加有趣。然后可以像程序员可能嵌套的任何其他表和其他 HTML 元素一样设置该表的格式。
HTML 中嵌套表的示例
以下是提到的示例：
示例#1
观察下面的嵌套表示例，主表中只有一个表。为了区分主表和嵌套表，我们使用了不同的边框半径和边框颜色。
代码：
<body>
<table border="5px" bordercolor="#8707B0">
<tr>
<td>Left side of the main table</td>
<td>
<table border="5px" bordercolor="#F35557">
<h4 align="center">Nested Table</h4>
<tr>
<td>nested table C1</td>
<td>nested table C2</td>
</tr>
<tr>
<td>nested table</td>
<td>nested table</td>
</tr>
</table>
</td>
</tr>
</table>
输出：
注意： 表在主容器表中的嵌套。主表内的嵌套表是带有红色边框的表。它被添加到 | 中。容器表的元素。
示例#2
我们的以下代码将演示主容器表内的嵌套表中其他 HTML 元素的嵌套。
代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title> NestedTables </title>
</head>
<body>
<caption title="Container Table"> Container Table </caption>
<table border="5px" bordercolor = "red">
<tr>
<td >
<table>
<tr> <th colspan="2"> Nested Table 2 </th> </tr>
<tr> <th> Column 1 </th> <th> Column 2 </th> </tr>
<tr> <td> Our First Table </td>
<td> Nested Within </td> </tr>
</table>
</td>
<td>
<table >
<tr> <th> Nested Table 2 </th> </tr>
<tr>
<td>
<ul>
<li> List Object 1 </li>
<li> List Object 2 </li>
<li> List Object 3 </li>
</ul>
</td>
</tr>
</table> </td> </tr>
<tr>
<td>
<table>
<tr> <th colspan="2" align="center"> Nested Table 3 </th> </tr>
<tr>
<td> <a href=""> Nested Table </a> </td>
<td> Demo Continued </td> </tr>
</table> </td>
<td>
<table>
<tr> <th> Nested Table 4 </th> </tr>
<tr>
<td> <img src="images.png" height="120px" width="120px" alt="Sorry Image could not be displayed"> </td> </tr> </table>
</td>
</tr>
</table>
</body>
</html>
上面的代码演示了一个表如何在其内部包含多个其他表，这些表可以包含您通常添加到简单 HTML 页面的任何类型的内容。上面的代码同样是无边框的。
注意：在上面的示例中，添加的 HTML 元素（例如 png 文件、超链接、表格或对象列表）可以简单地添加到 |
之一。元素。在上面的解释中，我已经注销了嵌套在其中的表格的所有边框。
请注意表格的边框是否可见。容器桌是一张带有红色边框的桌子，嵌套着带有蓝色、黄色、绿色和黑色边框的桌子。
使用表格完全格式化网页固然很好，但要记住的一件事是，嵌套越复杂，页面加载速度就越慢，因为浏览器进行渲染变得非常复杂.
|
