啊，说到这表元素，心里总有点复杂的情绪在翻腾。就像那些老物件，看着不起眼，可它实实在在陪着你走过一段漫长的路。刚入行那会儿，Internet Explorer 6横行的年代，整个网页设计啊，简直就是表格的天下。不是“布局用表格”，而是“离开了表格，你就根本没法布局”！
那日子，现在想起来都头皮发麻。一个页面，从头到尾，大大小小的表格套着表格，层层嵌套，简直就是俄罗斯套娃，还是套到你找不着北那种。想放个图片在文字旁边？表格！想做个两列布局？表格！就连按钮、导航，很多时候也是表格单元格撑出来的。每一个像素都要小心翼翼地用width、height、cellpadding、cellspacing去控制。稍微动一下？整个页面可能就塌了。别提什么响应式了，那时候连浏览器兼容性都搞得你焦头烂额。代码？那不是代码，那是一堆用来控制像素点在屏幕上排列位置的蜘蛛网，密密麻麻，解都解不开。调试？呵呵，一点点改数字，保存，刷新，看效果，再改……那不是开发，那是纯粹的体力活，像素级的折磨。
后来，CSS站起来了！救世主一样来了。一股脑儿地推行语义化，推行布局和内容分离。表格？那必须是用来展示数据的！其他任何布局，统统给我用div加CSS搞定。那时候，”tableless design”（无表格设计）简直是政治正确，谁还用表格做布局，简直是落后、反动、没品位！我们也跟着欢呼雀跃，终于可以摆脱那堆纠缠不清的<tr><td>了。感觉整个网页都变得轻盈了，代码也清晰多了，找个东西，改个样式，舒服！
可现实呢？当 Semantic Web 的风潮渐渐平息，当大家真的开始用 CSS 优雅地布局时，我们发现，表格这东西，它压根就没死！它活得好好的，而且在自己的地盘上，没人能取代它。哪块地盘？数据啊！尤其那些结构化的数据，你让我用div和CSS来模拟一个复杂的财务报表？一个带有各种合并单元格、多层表头、合计行的数据表格？开什么玩笑！那工作量，那维护成本，分分钟让你哭出来。
所以，你看，表元素，
，
| 这些东西，它们的真正价值，从来就不是用来把页面切成一块一块的。它们的使命，是呈现数据！是把那些一行一行、一列一列，或者带有层级关系的数据，用最直观、最符合逻辑的方式展现出来。 | <thead> 包裹表头，<tbody> 包裹主体，<tfoot> 放个合计什么的，<th> 明确这是标题单元格，而不是普通数据单元格。这些都是有语义的！不是随便写的！
尤其要提的是可访问性（Accessibility）。屏幕阅读器怎么理解一个表格？它得知道哪是标题，哪是数据，这个数据属于哪个标题下面。 当然，就算是用对了地方——也就是呈现数据，和表元素打交道也并非总是顺心顺意。比如表格的边框， |
发表回复