HTML5 Colspan - 替代方案 [英] HTML5 Colspan - alternative

问题描述

我在HTML中的一个td标签中使用了'colspan'。我不想在我的HTML中使用colspan。但是我仍然需要实现'colspan'所实现的功能。有什么办法可以达到这个目的？

解决方案

colspan 可以使用具有虚拟空单元<< td>< / td> 的表来模拟要跨越的槽，并绝对定位应该跨越它们的单元。你需要一个相对定位的包装 div 作为表格，因为你不能直接使表格成为定位的参考框架。

它变得相当丑陋，尤其是因为您需要担心行高 - 因为使单元格完全定位将其从表格格式中移除。您可以通过使用单元格内容的副本作为要跨越的虚拟单元格的内容来处理此问题。请参阅 jsfiddle 。

它变得复杂，所以任何无法处理简单 colspan 的软件也可能无法处理（至少如果它负责渲染文档）。

>

I am using 'colspan' in one of the td tags in my HTML. I don't want to use 'colspan' in my HTML. But still i need to achieve the function that is been achieved by 'colspan'. Is there any way to achieve this?

解决方案

The effect of colspan can be simulated using a table with dummy empty cells <td></td> for the slots that are to be spanned and absolutely positioning the cell that should span them. You need a relatively positioned wrapper div for the table, since you cannot directly make the table the frame of reference for positioning.

It gets rather ugly, especially since you need to worry about the row height – because making a cell absolutely positioned takes it away from table formatting. You could deal with this by using a copy of the cell content as the content of the dummy cell to be spanned. See jsfiddle.

It get complicated, so any software that cannot handle a simple colspan may fail to deal with this too (at least if it is responsible for rendering the document).

这篇关于HTML5 Colspan - 替代方案的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！