WordPress の表を使ったとき、表示上の見やすさの点で列を結合して使いたいときがあります。HTMLでも同様の処理になります。
例、以下のような明細を表示する表。
日付 | 商品 | 単価 | 数量 | 金額 |
---|---|---|---|---|
2022/07/01 | ペン | 100 | 20 | 2,000 |
2022/07/02 | ノート | 300 | 5 | 1,500 |
合計 | 3,500 |
合計行のセルを結合したいとき
日付 | 商品 | 単価 | 数量 | 金額 |
---|---|---|---|---|
2022/07/01 | ペン | 100 | 20 | 2,000 |
2022/07/02 | ノート | 300 | 5 | 1,500 |
合計 | 3,500 |
概要する箇所に coldpan=”“ を入れます。は、結合するセルの数。
テキストモードにして編集します。
<table class="samtable"> <tbody> <tr> <th>日付</th> <th>商品</th> <th>単価</th> <th>数量</th> <th>金額</th> </tr> <tr> <td>2022/07/01</td> <td>ペン</td> <td>100</td> <td>20</td> <td>2,000</td> </tr> <tr> <td>2022/07/02</td> <td>ノート</td> <td>300</td> <td>5</td> <td>1,500</td> </tr> <tr> <th>合計</th> <td coldpan="4"></td> <td>3,500</td> </tr>
行を結合したい場合、rowspan = “*” を使います。