1つのHTMLテーブルヘッダーを2つのテーブル列の上に置くことはできますか?Excelのマージとセンターのように?

StackOverflow https://stackoverflow.com/questions/8996466

質問

私は1つのテーブルヘッダーを2つのテーブル列の上に並べて中央に配置したいと思っています。これは可能ですか?

役に立ちましたか?

解決

<th colspan="2">. This .</th>

少し外挿する。..

<table>
  <thead>
    <tr>
      <th>Single Column</th>
      <th colspan="2">Double Column</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Column One</td>
      <td>Column Two</td>
      <td>Column Three</td>
    </tr>
  </tbody>
</table>

それはあなたから働くのに十分なものを与えるはずです。

他のヒント

2列しかない場合は、<caption>を使用していることをお勧めします。それ以外の場合は、他の答えで提案されているようにColspanを使用してください。

<table>
  <caption>This will span all columns.</caption>
  <tr><td>column one</td><td>column two</td></tr>
</table>
.

もちろん

このページを参照してください。テーブルヘッダーセルのcolspanという属性を探しています。

私たちはより良い方法でそれをすることができます。

<table border="1"> 
  <tr>
    <th colspan="1" scope="colgroup">Test Heading</th>
    <th colspan="3" scope="colgroup">Mars</th>
    <th colspan="3" scope="colgroup">Venus</th>
    <th colspan="3" scope="colgroup">Test</th>
  </tr>
  <tr>
    <th rowspan="2"></th>
    <th scope="col">Produced</th>
    <th scope="col">Sold</th>
    <th scope="col">Sold</th>
    <th scope="col">Produced</th>
    <th scope="col">Sold</th>
    <th scope="col">Sold</th>
    <th scope="col">Test 1</th>
    <th scope="col">Test 2</th>
    <th scope="col">Test 3</th>
  </tr>
</table>
.

table ref from w3.orgからの表参照あなたがもっと知りたいのなら。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top