网页中应用表格爱好者

时间:2010-04-07 09:29 来源: 作者: 点击:次

你认为已经知道怎么制做表格了吧。当然，你已经了解 table、tr、td和th标签了，甚至还在你的口袋里装入了rowspan和colspan。你确实可以制做一个精美小巧的咖啡色三合板桌子（表格），但难道你不想做一个优雅稳固，上面有玻璃的，足以承受一头大笨象的宴会桌（

你认为已经知道怎么制做表格了吧。当然，你已经了解 table、tr、td和th标签了，甚至还在你的口袋里装入了rowspan和colspan。你确实可以制做一个精美小巧的咖啡色三合板桌子（表格），但难道你不想做一个优雅稳固，上面有玻璃的，足以承受一头大笨象的宴会桌（表格）？

列反罢工

表格行简直使表格列看起来很愚蠢。同样的工作，表格由行与行构建，让列感到十分沮丧。

但是很幸运，colgroup和col标签来拯救热心的列了。

这两个标签允许你定义表格列和尽你所需地样式化它们，对于你需要把列排成行或不同着色特别有用，如果没有它们，你需要样式化每一个单独的单元格。

这是一个使用这些标签的例子：

This	That	The other
Ladybird	Locust	Lunch

alternate类的样式将被应用到第二列，或者说每一行的第二个单元格。

你当然可以在colgroup或者col上使用span属性，跟rowspan和colspan有相似的用途

colgroup一起使用可以定义属于列组的行数，比如会组合头两列。当在colgroup使用span时，不应该再使用col标签。

在col里使用span是更明智的，可以，比如，应用在上述例子像这样：

 ...

这将把alternate类应用到最后两列。

注意

哦，但是可能有一个陷井，不是吗？那就是：你仅能样式化列的是边框、背景、宽度和可见性。

Internet Explorer在这方面看起来比其他浏览器表现更好因为它装载有漂亮的CSS属性比如 color，但是，正如结果一样，这是因为它疯狂古怪的行为而已。这种奇特的异常可以让Ian Hixie来解释。

摘要和说明插曲

一个简要和容易的提高易用性的思考是，总是为表格应用摘要和说明。

摘要可以在表格起始标签table中用summary属性应用到表格中。这不会显示，但可以辅助非可视化的表格表现。

caption标签在起始标签table后直接定义说明。它默认直接在表格顶端出现，但可以在CSS属性caption-side中设置top、right、bottom或者left值，尽管IE不会在意。

...

表头、表注和滚动表格的探讨

thead、tfoot和tbody允许你把表格分为表头、表注和表格主体。对于大表格尤其有用，在打印的时候，表头和表注应该会在每一页都出现。

这些元素必须按thead-tfoot-tbody的顺序定义，像这样：

Locust mating habits

 ...

Header 1	Header 2	Header 3
Footer 1	Footer 2	Footer 3
Cell 1	Cell 2	Cell 3

你可以让表格主体tbody在基于Gecko的浏览器（Mozilla、Firefox和Netscape 6+等）滚动，通过应用overflow: auto; max-height: [whatever] 的样式。然后你可以看见表头和表注固定，而表的主体右边有滚动条。你应该谨慎使用max-height属性因为IE不认识，比较安全的做法是使用 height属性，IE将为它应用到每一行。

注意：说回浏览器的差异，目前IE遇到表头和表注时还是没有什么线索，尽管还是当作表格来处理，但打印的时候不会在哦每一页都出现表头和表注，只孤零零地传递滚动的表格。

注意

谨慎对待滚动表格。尽管它们提供十分有用的目的，大部分用户不习惯它们并且认为线性数据是唯一的。

(责任编辑：admin)