透析表格──表中表

网络与通信

表中表((图1))效果是借用域组标记fieldset与表格标记table相结合来实现的。fieldset是HTML中的一个标记,它是用来将表单中的域集合成一组的,我们姑且称它为域组。本例中还将接触到一个新的标记legend,它只出现在域组标记中,我把它叫做域组标记,用来指定fieldset的标题。(图2)为legend效果的演示。

图1
图1
图2
图2

代码如下:

域组标题
legend演示

表中表效果的原理就是借用域组标记,在这一标记内再插入一个细线表格。下面我们分三步来制作:
① 插入两个表格。注意,第一个表格将作为表中表的标题,所以要小一点,我们设置它的宽为100;第二个表格宽为200,高为50(如(图3))。
图3
图3

② 到源代码状态下写入代码,按按钮切换到code view方式,可以看到如下的代码:




表中表效果





这是表中表

我们先用fieldset将这两个表格包含起来,并设置fieldset宽为200,居中,再用legend标记将第一个表格包含起来:



...



...


这时候如果按F12预览的话,看到的效果如(图4)
图4
图4

③ 还需要修饰一下标题,所以我们为第一个表格加上边框,这样就能完成最后一步了。
仍然在源代码中,在第一个表格的标记中加入CSS代码:

OK,看看效果还满意不:)