html - 展开按钮以使用 colspan 和 rowspan 覆盖整个单元格

Question

我需要在表格的单元格内插入一个按钮。此按钮应完全适合单元格。

<td colspan="2" rowspan="2">
   <button class="btn btn-default btn-block m-0" style="height:100%;">
       Button
   </button>
</td>

我尝试了上面的代码，但它的实际按钮只覆盖了连接单元格的第一行。

标签： htmlbuttonhtml-tablebootstrap-4

Answer 1

这是你要找的吗？

按钮行也占用下一行的空间

<table>
      <thead></thead>
      <tbody>
        <tr>
          <td>Lorem ipsum</td>
          <td>dolor sit amet</td>      
          <td>test3</td>
        </tr>
        <tr>
          <td colspan="2" rowspan="2">
            <button class="btn btn-default btn-block m-0" style="height:100%;">
            Button
           </button>
          </td>
          <td>test3</td>
        </tr>
        <tr>
          <td>Lorem ipsum</td>
          <td>dolor sit amet</td>      
          <td>test3</td>
        </tr>
      </tbody>
    </table>