表を縦に結合する方法
HTMLでtableタグなどで作った表を縦に結合する方法です。
表を縦に結合するには
表を縦に結合するにはrowspanを使います。
下記の表を書きかえてみます。
<table border="1"> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> </table>
（表示例）
| テキスト | テキスト | テキスト |
| テキスト | テキスト | テキスト |
| テキスト | テキスト | テキスト |
rowspanを使って表を縦に結合させます。
<table border="1"> <tr> <td rowspan="3">テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> </table>
（表示例）
| テキスト | ||
| テキスト | テキスト | テキスト |
| テキスト | テキスト | テキスト |
表を横に結合する場合
別記事でも少し書いた表を横に結合する方法です。
横に結合するにはcolspanを使います。
<table border="1"> <tr> <td colspan="3">テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> <tr> <td>テキスト</td> <td>テキスト</td> <td>テキスト</td> </tr> </table>
（表示例）
| テキスト | ||
| テキスト | テキスト | テキスト |
| テキスト | テキスト | テキスト |
