经过上一个练习，我们对格子有了一个基本的了解。
第一节：先让我们来复习一下，格子是如何用代码画出来的。
下面，我来画2个简单的格子：
格子1
它的代码是这样的：
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/200411141003725527.jpg border=1>
<TBODY>
<TR>
<TD>
</TD>
</TR>
</TBODY>
</TABLE>
格子2
它的代码是这个样子：
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/2004113022143961.jpg border=1>
<TBODY>
<TR>
<TD>
</TD>
</TR>
</TBODY>
</TABLE>
上次我们练习到，格子当中，添加文字，图象，音乐等内容时，是加入到 <TD>..........</TD> 中间。
举例来说，我想在格子1中间，加上诗歌：
《暮秋独游曲江》李商隐 荷叶生时春恨生，荷叶枯时秋恨成。深知身在情长在，怅望江头江水声。
我只需要简单地在格子1的代码中间，那对 <TD>......</TD> 之间，添加这段诗歌文字就可以了：
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/200411141003725527.jpg border=1>
<TBODY>
<TR>
<TD>
《暮秋独游曲江》李商隐 荷叶生时春恨生，荷叶枯时秋恨成。深知身在情长在，怅望江头江水声。
</TD>
</TR>
</TBODY>
</TABLE>
下面是效果图：
| 《暮秋独游曲江》李商隐 荷叶生时春恨生，荷叶枯时秋恨成。深知身在情长在，怅望江头江水声。 |
那么，这个 <TD>.......</TD> 之间，也可以镶嵌一个格子进去。做法也是一样，就是把另外一个格子的代码，填入到它之间就是了。
第二节： 格子镶套：
我们现在来练习一下，把格子2镶嵌到格子1中去：
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/200411141003725527.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/2004113022143961.jpg border=1>
<TBODY>
<TR>
<TD>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
下面是效果图：
上面绿色代码，是格子2的。它们镶嵌到红色的格子1的代码中了。镶入的位置，是在<TD>......</TD> 之间。
同样的道理，绿色的格子2的代码，也可以继续镶入格子的。
现在我来加上格子3：
格子3
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/20041114959024242.jpg border=1>
<TBODY>
<TR>
<TD>
</TD>
</TR>
</TBODY>
</TABLE>
那么，我继续往里头镶嵌，看看会怎么样呢？
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/200411141003725527.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/2004113022143961.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE height=100 width=100 background=http://xz1.2000y.net/348114/uploadpic/20041114959024242.jpg border=1>
<TBODY>
<TR>
<TD>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
下面是效果：
理解了这个原理，你就对下面这个不陌生了：
这个，不正是我们在自言自语（1）中，见到的边框9吗？
第三节：调整格子的布局：
上边我们练习中的格子镶套，需要经过一些布局调整，才能看起来漂亮。下面是可以做的调整：
（1）将内套的格子，都居中放置，这样左右距离就整齐。具体来说，是在<Table......>中， 添加 align=center.
（2）每层边框的宽度，可以使用格间距来调整。具体说来，是在 <Table.....>中， 添加 Cellspacing=数字。
有关这些东西的使用，我们在上一个“自言自语”中，已经得到深入的解释了。
下面是上边那个类似“边框9”的代码，你可以对照效果图看看：
<TABLE cellSpacing=25 width="100%" align=center background=http://xz1.2000y.net/348114/uploadpic/200411141003725527.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=15 width="100%" align=center background=http://xz1.2000y.net/348114/uploadpic/2004113022143961.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE width="100%" background=http://xz1.2000y.net/348114/uploadpic/20041114959024242.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=5 width="100%" borderColorLight=#7ea063 background=http://xz1.2000y.net/348114/uploadpic/200411141005269291.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE cellPadding=0 width="100%" background=http://xz1.2000y.net/348114/uploadpic/20041114959024242.jpg border=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=5 width="100%" background=http://xz1.2000y.net/348114/uploadpic/200411141005269291.jpg border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 width="100%" background=http://xz1.2000y.net/348114/uploadpic/20041130223243143.jpg border=0>
<TBODY>
<TR>
<TD>
加入内容
</TD>
</TR>
</TBODY>
</TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
