html – 如何在表的tbody / thead部分创建边框?

前端之家收集整理的这篇文章主要介绍了html – 如何在表的tbody / thead部分创建边框?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试用表格数据创建一个页面,它必须显示为多个表.但是,我有两个相互矛盾的要求:

>每个表必须有一个边框.
>每个表的列宽必须能够根据内容进行重新调整大小.但是,列宽必须在所有表中保持一致. (即,列的大小基于所有表中该列中的最大单元).

为了处理第二个要求,我有一个单一的顶级表,其中包含多个thead和tbody部分.这完美地实现了#2.本质上,我已经在一个较大的父表中创建了多个伪表,并将其与一个随机的tbody分组:

<table>
   <thead>
      table1 header content...
   </thead>
   <tbody>
      table1 body content...
   </tbody>
   <thead>
      table2 header content...
   </thead>
   <tbody>
      table2 body content...
   </tbody>
</table>

现在,我试图解决第一个要求.每个伪表必须在其周围有一个边框,将其自己作为一个真正的表格.

我发现,令人失望的是,IE 6/7不允许在/ tbody标签周围添加边框样式,或者我只需向顶部/左/右边框添加顶/左/右边框样式风格为tbody.

为这些作品创建正确的表和样式边框来解决#1,但它打破了#2.

另一个选择是使用第一个孩子和最后一个孩子的样式来创建我的边框.不幸的是,这并不美观,IE​​ 6/7也不起作用.

我一直在研究的另一个替代方法是在整个表格上创建一个边框,并尝试在伪表之间创建一个创建我的分隔符的行,但是当我可以创建顶部/底部边框时,我还没有发现意味着删除该表的左/右边框只是该行.那可能吗?

我的最后一个选择是创建用于绘制左,右,顶和底边界的类,设置适当的表单元格以使用这些类.我知道这将最终奏效,但它是非常笨重的,并且使得非常混乱的标记. Colgroups无法将我保存在这里,因为他们无法处理边框样式.这是不幸的,因为它会使这个解决方案更容易胃.

有没有更好的方法来完成我可能错过的边界?

解决方法

使用< table rules =“groups”>或类似的规则值

http://www.w3.org/TR/html4/struct/tables.html#h-11.3.1

猜你在找的HTML相关文章