HTML「合併儲存格」讓表格內的儲存格(,)合併

HTML「合併儲存格」讓表格內的儲存格(,)合併

HTML「合併儲存格」讓表格內的儲存格(<th>,<td>)合併


資料來源: https://mnya.tw/cc/word/1224.html


HTML Code

<table border="1">
      <tbody>
        <tr>
          <th>網站名稱</th>
          <th>七月訪客數(萬)<br>
          </th>
          <th>八月訪客數(萬) </th>
        </tr>
        <tr>
          <td>萌芽綜合天地<br>
          </td>
          <td colspan="2">2 (colspan="2")<br>
          </td>
        </tr>
        <tr>
          <td>萌芽悠遊網<br>
          </td>
          <td>1<br>
          </td>
          <td>2<br>
          </td>
        </tr>
      </tbody>
    </table>
    <br>
    <table border="1">
      <tbody>
        <tr>
          <th>網站名稱</th>
          <th>七月訪客數(萬)<br>
          </th>
          <th>八月訪客數(萬) </th>
        </tr>
        <tr>
          <td>萌芽綜合天地<br>
          </td>
          <td>2<br>
          </td>
          <td rowspan="2">2 (rowspan="2")<br>
          </td>
        </tr>
        <tr>
          <td>萌芽悠遊網<br>
          </td>
          <td>1<br>
          </td>
        </tr>
      </tbody>
    </table>


HTML 結果

網站名稱 七月訪客數(萬) 八月訪客數(萬)
萌芽綜合天地 2 (colspan=”2″)
萌芽悠遊網 1 2


網站名稱 七月訪客數(萬) 八月訪客數(萬)
萌芽綜合天地 2 2 (rowspan=”2″)
萌芽悠遊網 1


PS. HTML 基本表格語法

    這是一個 3×4 大小的表格,HTML 中有 3 個 <tr> 即表示這表格有 3 列,而每個 <tr> 裡面都有 4 個 <td> 即表示這表格有 4 行!



    有注意到嗎?每個 <tr> 裡面的 <td> 數量要一樣喔,因為這樣才會組成一個格子狀的表格嘛!

<table>
  <tr>
    <td>國家</td>
    <td>首都</td>
    <td>人口</td>
    <td>語言</td>
  </tr>
  <tr>
    <td>USA</td>
    <td>Washington D.C.</td>
    <td>309 million</td>
    <td>English</td>
  </tr>
  <tr>
    <td>Sweden</td>
    <td>Stockholm</td>
    <td>9 million</td>
    <td>Swedish</td>
  </tr>
</table>

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *