【问题标题】:Colspan not working as expected (without CSS)Colspan 没有按预期工作(没有 CSS)
【发布时间】:2018-11-01 15:00:09
【问题描述】:

我正在做一个项目,目前我无法使用 CSS。 我想用这种方式做一个3列3行的表: Table .如您所见,A 单元格需要 colspan="2" 和 rowspan="2"。 这是我使用的代码:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Table HTML</title>
    <style>
      table, tr, th, td {border: 1px solid black;}
      tr, th, td {padding: 10px;}
    </style>
  </head>
  <body>
    <table>
      <tr>
        <th rowspan="2" colspan="2">A</th>
        <th>B</th>
        <th>C</th>
      </tr>

        <tr>
          <td>D</td>
          <td>E</td>
        </tr>

        <tr>
          <td colspan="2">F</td>
          <td colspan="2">G</td>
        </tr>

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

但 A 单元格不在 2 行中,F 和 G 相同 如何以正确的方式拟合所有单元格?

我找到了CSS宽度属性的解决方案,通过这种方式:

<!DOCTYPE html>
<html lang="it" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Tabella HTML</title>
    <style>
      table, tr, th, td {border: 1px solid black;}
      tr, th, td {padding: 10px;}
    </style>
  </head>
  <body>
    <table>
      <tr>
        <th rowspan="2" colspan="2">A</th>
        <th>B</th>
        <th>C</th>
      </tr>

        <tr>
          <td>D</td>
          <td>E</td>
        </tr>

        <tr>
          <td colspan="2" style="width:50%">F</td>
          <td colspan="2" style="width:50%">G</td>
        </tr>

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

但是对于这个项目,我不能使用 CSS。 谢谢。

【问题讨论】:

    标签: html html-table


    【解决方案1】:

    足够大的人(或者直到现在还在创建 HTML 电子邮件)仍然记得很好的旧 width HTML 属性:)

    <!DOCTYPE html>
    <html lang="en" dir="ltr">
    
    <head>
      <meta charset="utf-8">
      <title>Table HTML</title>
      <style>
        table,
        tr,
        th,
        td {
          border: 1px solid black;
        }
        
        tr,
        th,
        td {
          padding: 10px;
        }
      </style>
    </head>
    
    <body>
      <table>
        <tr>
          <th rowspan="2" colspan="2">A</th>
          <th>B</th>
          <th>C</th>
        </tr>
    
        <tr>
          <td>D</td>
          <td>E</td>
        </tr>
    
        <tr>
          <td colspan="2" width="100">F</td>
          <td colspan="2" width="100">G</td>
        </tr>
    
      </table>
    </body>
    
    </html>

    【讨论】:

    • 非常感谢,我一直用 CSS 做这些事情 :)
    猜你喜欢
    • 2012-09-13
    • 2013-12-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多