首頁  >  問答  >  主體

沒有 CSS 的純 HTML:Colspan 在 th/td 中無法正常運行,在所有行中保持一致

我不明白為什麼我的 colspan 不工作。我有一個 CSS 解決方案,但我只是困惑為什麼這行不通。 第一列的寬度應為其他列的 1/3,第一列和 td 上有 colspan="1",而所有其他列的寬度均為 colspan="3"。

該應用程式用於排行榜,因此第一列將包含排名編號(1、2、3...),並且需要比後續列窄得多。

當然可以用class="colspan-3"class="colspan-1" 以及css colspan-1{width:4.5%} colspan-3 {width:13.5%} 來解決 或任何數學結果...但是,我真的只是想知道發生了什麼。

添加詳細信息,因為我認為這個問題將來會對某人有所幫助:

當時,我認為我可以使用 colspan 作為相對單位,本質上是通過使每個列的寬度相對於其他列。我遇到的問題是每列都有完全相同的單位。它僅適用於列中的單一儲存格,本質上類似於 Microsoft Excel 中的「合併」功能。

<table border="2">
  <thead>
    <tr>
      <th colspan="1">th1 colspan1</th><!-- colspan=1 here -->
      <th colspan="3">th2 colspan3</th>
      <th colspan="3">th3 colspan3</th>
      <th colspan="3">th4 colspan3</th>
      <th colspan="3">th5 colspan3</th>
      <th colspan="3">th6 colspan3</th>
      <th colspan="3">th7 colspan3</th>
      <th colspan="3">th8 colspan3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td colspan="1">td1 colspan1</td><!-- colspan=1 here -->
      <td colspan="3">td2 colspan3</td>
      <td colspan="3">td3 colspan3</td>
      <td colspan="3">td4 colspan3</td>
      <td colspan="3">td5 colspan3</td>
      <td colspan="3">td6 colspan3</td>
      <td colspan="3">td7 colspan3</td>
      <td colspan="3">td8 colspan3</td>
    </tr>
  </tbody>
</table>

P粉899950720P粉899950720183 天前336

全部回覆(1)我來回復

  • P粉011360903

    P粉0113609032024-04-01 10:46:55

    感謝@Ouroborus,我以為我瘋了,但在每天使用 HTML 近十年之後,顯然仍然有東西需要學習。

    如果列中的所有單元格都設定為相同的要跨越的列數,則colspan 將不起作用,請在此處定義:https://developer.mozilla.org/en-US/docs /Web/HTML/Element/td

    #再次感謝Ouroborus發現了我的誤解!

    回覆
    0
  • 取消回覆