Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/90.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html tr包含仅具有行跨度的td';t使用下一个tr强制新线路_Html_Css_Html Table - Fatal编程技术网

Html tr包含仅具有行跨度的td';t使用下一个tr强制新线路

Html tr包含仅具有行跨度的td';t使用下一个tr强制新线路,html,css,html-table,Html,Css,Html Table,我正在用table编写一个小程序。我发现如果一个tr只包含具有rowspan和colspan属性的td,那么当我添加另一个tr时,这个tr就不会在换行符中。 代码如下: <table> <tr> <td colspan='6' rowspan='2'>hello</td> <td colspan='6' rowspan='2'>hello</td> </tr> <tr> <

我正在用table编写一个小程序。我发现如果一个tr只包含具有rowspan和colspan属性的td,那么当我添加另一个tr时,这个tr就不会在换行符中。 代码如下:

<table>
<tr>
    <td colspan='6' rowspan='2'>hello</td>
    <td colspan='6' rowspan='2'>hello</td>
</tr>
<tr>
    <td>hello</td>
</tr>
<tr>
    <td>hello</td>
</tr></table>

你好
你好
你好
你好
如需参考,请参阅JSFIDLE链接。 这看起来真的很尴尬,我不知道如何解决这个问题。 非常感谢你的帮助


这是我想要的输出(没有第二个空标记)。我正在编写的这个小程序是为用户自己在html页面上绘制表格而编写的。(我需要得到html格式的表格来生成pdf报告,这样用户自己绘制表格会非常方便,我不必为他们编写html来获取我需要的数据)。当我测试这个小程序时,我发现了这个bug。如果用户只想将tr设置为6个colspans和2个rowspan(假设他/她希望td更高),那么下一个tr将在同一行中。因此,我试图找到一个解决方案来修复它,但没有成功。

问题是行跨度设置为
2
。因此,电池也会占用其下方电池的空间。然后,第二行从右侧的两个位置开始(经过具有rowspan的单元格)。然后该单元格显示在表的顶部,因为上面没有单元格。这是因为没有一个单元格只占据第一行。这个例子可以更清楚地说明这一点:

表格{
边界间距:0;
边界塌陷:塌陷;
}
运输署{
边框:1px纯黑;
}

你好
你好
你好

不幸的是,如果表中只有两行,则不能跨越两行。在您的情况下,它必须至少为3行。否则,它将占用所有两个可用行,并将其他行放置在右侧

因此,如果您假设他/她想要生成一个更高的表格单元格,并跨越它, 您必须禁止它并实现以下条件:跨越行的数量必须小于表中所有行的数量。否则,它将生成一个无效表


如果必须使某一行大于另一行,则可以将高度属性设置为此行。

我可以看出您不想使用此属性,但对下一行(不存在)使用空的
将解决此问题

我将此作为一个答案发布,因为我看不到它在任何地方突出显示,这是对这类问题的一个答案,这是我刚刚需要使用的

<table>
    <tr>
        <td colspan='6' rowspan='2'>hello</td>
        <td colspan='6' rowspan='2'>hello</td>
    </tr>
    <tr></tr> <!-- THIS LINE -->
    <tr>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
        <td>hello</td>
    </tr>
    <tr></tr>
</table>

你好
你好
你好
你好
你好
你好
你好
你好
你好
你好
你好
你好
你好
你好

您为什么要这样做?这没有道理。张贴一张图片,以显示希望得到的愿望输出。这就是你想要的吗?这是我想要的输出(没有第二个空标记。我正在编写的这个小程序是为了让用户自己在html页面上绘制表格(这样我可以更方便地获得html表格格式)。当我测试这个小程序时,我发现了这个错误。如果用户只想设置一个带有6个colspan和2个rowspan的tr(假设他/她希望td更高),那么下一个tr将在同一行。因此,我试图找到解决方案来解决它,但没有运气。@humble.rumble问题仍然没有解决。添加空标记将导致我的程序中出现其他问题,这不是我想要的解决方案。我添加它只是为了向您展示我正在寻找的表布局。因此,您的意思是不是帽子当我用rowspan属性设置td时,它不会占用空间?因此,我如何解决这个问题?@EmmaWu如小提琴中所示,它也会占用它下面的空间。至于如何解决它,我不知道你在尝试做什么。你提供的代码并不是一个有效的表。正如我在后面的问题中添加的一样,我正在设计一个由用户设置的表格。假设用户想要生成一个更高的表格单元格并将其跨越。因此,他/她会按照我所说的方式生成表格。但问题是,下一个tr将与上一个tr相同。这不是用户想要的。因此,我正在尝试解决此问题,但运气不佳。我可以试试吗与单元格显示相关的属性。