Question

我有一些非常简单的html，但出于某种原因，我无法让rowspan工作。它不是填充整个左侧列，而是仅占据其底部的一个单元格。我想得到这样的东西：

+----------+-----------+---------+
| label 1  | content 1 | label 2 |
|          +-----------+         |
|          | content 2 |         |
|          +-----------+         |
|          | content 3 |         |
|          +-----------+         |
|          | content 4 |         |
|          +-----------+         |
|          | content 5 |         |
+----------+-----------+---------+

但是我对以下代码没有运气。 JSBIN

<tr>
    <td rowspan="5">
        label one
    </td>
    <td>
        content 1
    </td>
</tr>
<tr>
    <td>
        content 2
    </td>
</tr>
<tr>
    <td>
        content 3
    </td>
</tr>
<tr>
    <td>
        content 4
    </td>
</tr>
<tr>
    <td>
        content 5
    </td>
    <td rowspan="5">
        label two
    </td>
</tr>

非常感谢。

Answer 1

只是一个小小的改变：

<table border="1">


    <tr>
        <td rowspan="5">
            label one
        </td>
        <td>
            content 1
        </td>
      <td rowspan="5">
            label two
        </td>
    </tr>
    <tr>
        <td>
            content 2
        </td>
    </tr>
    <tr>
        <td>
            content 3
        </td>
    </tr>
    <tr>
        <td>
            content 4
        </td>
    </tr>
    <tr>
        <td>
            content 5
        </td>

    </tr>


</table>

Answer 2

试试：

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
 <table border="1">


    <tr>
        <td rowspan="5">
            label one
        </td>
        <td>
            content 1
        </td>
      <td rowspan="5">
            label two
        </td>
    </tr>
    <tr>
        <td>
            content 2
        </td>
    </tr>
    <tr>
        <td>
            content 3
        </td>
    </tr>
    <tr>
        <td>
            content 4
        </td>
    </tr>
    <tr rowspan="5">
        <td>
            content 5
        </td>
    </tr>


</table>
</body>
</html>

Answer 3

将vertical-align：top添加到内联样式，或设置类并执行相同操作。应该工作。

<td rowspan="5" style="vertical-align:top">

html rowspan表现不如预期

3 个答案: