Question

我正在尝试使用rowspan创建一个复杂的表格，使用此代码在fiddle中看起来很好：

<table border="1" style="margin:5px;">
    <tr>
        <th><b>Name</b></th>
        <th><b>Date</b></th>
        <th><b>Time</b></th>
        <th><b>No. of Hours</b></th>
    </tr>
    <tr>
        <td rowspan="26">Sample Name</td>
    </tr>
    <tr>
        <td rowspan="6">2016-03-04</td>
    </tr>
    <tr>
        <td>04:59:11 pm</td>
        <td rowspan="5">0</td>
    </tr>
    <tr>
        <td>04:59:13 pm</td>
    </tr>
    <tr>
        <td>04:59:15 pm</td>
    </tr>
    <tr>
        <td>04:59:19 pm</td>
    </tr>
    <tr>
        <td>04:59:33 pm</td>
    </tr>
    <tr>
        <td rowspan="3">2016-03-07</td>
    </tr>
    <tr>
        <td>08:23:10 am</td>
        <td rowspan="2">0</td>
    </tr>
    <tr>
        <td>04:04:01 pm</td>
    </tr>
    <tr>
        <td rowspan="3">2016-03-08</td>
    </tr>
    <tr>
        <td>01:26:56 pm</td>
        <td rowspan="2">0</td>
    </tr>
    <tr>
        <td>05:00:48 pm</td>
    </tr>
    <tr>
        <td rowspan="6">2016-03-09</td>
    </tr>
    <tr>
        <td>08:21:35 am</td>
        <td rowspan="5">0</td>
    </tr>
    <tr>
        <td>08:21:59 am</td>
    </tr>
    <tr>
        <td>09:08:01 am</td>
    </tr>
    <tr>
        <td>09:09:52 am</td>
    </tr>
    <tr>
        <td>02:40:22 pm</td>
    </tr>
    <tr>
        <td rowspan="3">2016-03-10</td>
    </tr>
    <tr>
        <td>09:50:43 am</td>
        <td rowspan="2">0</td>
    </tr>
    <tr>
        <td>11:44:39 am</td>
    </tr>
    <tr>
        <td rowspan="2">2016-03-11</td>
    </tr>
    <tr>
        <td>11:05:03 am</td>
        <td rowspan="1">0</td>
    </tr>
</table>

但是当我尝试将它放在FPDF生成的页面中时，它们是每行上方的空白区域，当您在HTML页面中显示时，您将不会注意到这些空格。请看下面的截图：

现在，当我仔细观察小提琴时，其中有空格，但它并不像FPDF生成的文件那样明显。

我怎样才能摆脱那些空地？

Answer 1

你实际上做错了。您正在为每个列创建一个行，并且渲染器会尝试填充间隙，这就是您看到空行的原因。我设法修复了表，但它背后的逻辑非常奇怪。您只需要在一行中有足够的列，以便渲染器了解哪些列是行挖掘。无论如何，这是结果。

<table border="1" style="margin:5px;">
  <tr>
    <th><b>Name</b>
    </th>
    <th><b>Date</b>
    </th>
    <th><b>Time</b>
    </th>
    <th><b>No. of Hours</b>
    </th>
  </tr>
  <tr>
    <td rowspan="17">Sample Name</td>
    <td rowspan="5">2016-03-04</td>
    <td>04:59:11 pm</td>
    <td rowspan="5">0</td>
  </tr>
  <tr>
    <td>04:59:13 pm</td>
  </tr>
  <tr>
    <td>04:59:15 pm</td>
  </tr>
  <tr>
    <td>04:59:19 pm</td>
  </tr>
  <tr>
    <td>04:59:33 pm</td>
  </tr>
  <tr>
    <td rowspan="2">2016-03-07</td>
    <td>08:23:10 am</td>
    <td rowspan="2">0</td>
  </tr>
  <tr>
    <td>04:04:01 pm</td>
  </tr>
  <tr>
    <td rowspan="2">2016-03-08</td>
    <td>01:26:56 pm</td>
    <td rowspan="2">0</td>
  </tr>
  <tr>
    <td>05:00:48 pm</td>
  </tr>
  <tr>
    <td rowspan="5">2016-03-09</td>
    <td>08:21:35 am</td>
    <td rowspan="5">0</td>
  </tr>
  <tr>
    <td>08:21:59 am</td>
  </tr>
  <tr>
    <td>09:08:01 am</td>
  </tr>
  <tr>
    <td>09:09:52 am</td>
  </tr>
  <tr>
    <td>02:40:22 pm</td>
  </tr>
  <tr>
    <td rowspan="2">2016-03-10</td>
    <td>09:50:43 am</td>
    <td rowspan="2">0</td>
  </tr>
  <tr>
    <td>11:44:39 am</td>
  </tr>
  <tr>
    <td rowspan="1">2016-03-11</td>
    <td>11:05:03 am</td>
    <td rowspan="1">0</td>
  </tr>

</table>

我希望它有效。

摆脱复杂表中的空白空间

1 个答案: