Question

 <html>
  <head>
    <meta charset = "utf-8">
    <title>table</title>
  </head>
  <body>
    <table border = "1">
        <thead>
            <tr>
                <th rowspan = "6">Home Ticket Options</th>
                <th>Zone</th>
                <th>Price</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Red</td>
                <td>$101.00</td>
            </tr>
            <tr>
                <td>Blue</td>
                <td rowspan = "2">25.50</td>
            </tr>
            <tr>
                <td>Green</td>
            </tr>
            <tr>
                <td>Yellow</td>
                <td rowspan = "2">$9.00</td>
            </tr>
            <tr>
                <td>Orange</td>
            </tr>
        </tbody>
    </table>
  </body>
</html>

最后2个行的行按原样向下拉伸2行，但第一行行不向下延伸6行。关于我做错了什么的想法？请帮忙。

Answer 1

因为您在rowspan="6"表标题中使用了<thead>，所以您不能。您必须在rowspan="5"表格主体第一行中使用<tbody>。这可以在表中完成所有五行。

查看此jsbin

<html>
  <head>
    <meta charset = "utf-8">
    <title>table</title>
  </head>
  <body>
    <table border = "1">
        <thead>
            <tr>
                <th>Home Ticket Options</th>
                <th>Zone</th>
                <th>Price</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td rowspan = "5">Price</td>
                <td>Red</td>
                <td>$101.00</td>
            </tr>
            <tr>
                <td>Blue</td>
                <td rowspan = "2">25.50</td>
            </tr>
            <tr>
                <td>Green</td>
            </tr>
            <tr>
                <td>Yellow</td>
                <td rowspan = "2">$9.00</td>
            </tr>
            <tr>
                <td>Orange</td>
            </tr>
        </tbody>
    </table>
  </body>
</html>

Answer 2

确定。我想到了。我必须把它全部放在tbody＆amp;然后rowpan the cell。谢谢大家。

为什么第一行没有工作？

2 个答案:

查看此jsbin