table要素に align="" を追加すると、表の配置位置を指定することができます。
<table align="left"> 〜 </table>
| 属性 | 値 | 説明 |
|---|---|---|
| align="" | left | 左側に配置 （左フロート） |
| center | 中央に配置 | |
| right | 右側に配置 （右フロート） |
上記の属性は、HTML 4.01では非推奨とされています。（Strict DTDでは使用できません）
align属性の値に left または right を指定すると、その表が左、または右にフロート（浮動化）します。
- left … 表を左に配置して、後続の内容を右側に回り込ませます。
- right … 表を右に配置して、後続の内容を左側に回り込ませます。
上記の値を指定する場合は、「回り込みを解除する」もご覧ください。
この指定内容はスタイルシートで代替することができます。指定方法の詳細は「関連ページ」をご覧ください。
使用例
■左側に配置した例
<div>
<table border="3" align="left">
<tr>
<td>データセル1-1</td>
<td>データセル1-2</td>
<td>データセル1-3</td>
</tr>
<tr>
<td>データセル2-1</td>
<td>データセル2-2</td>
<td>データセル2-3</td>
</tr>
<tr>
<td>データセル3-1</td>
<td>データセル3-2</td>
<td>データセル3-3</td>
</tr>
</table>
<p>
表を左に配置して、
<br>
右側にテキストを回り込ませます。
<br clear="left">
回り込みを解除しました。
</p>
</div>
表示例
| データセル1-1 | データセル1-2 | データセル1-3 |
| データセル2-1 | データセル2-2 | データセル2-3 |
| データセル3-1 | データセル3-2 | データセル3-3 |
表を左に配置して、
右側にテキストを回り込ませます。
回り込みを解除しました。
■右側に配置した例
<div>
<table border="3" align="right">
<tr>
<td>データセル1-1</td>
<td>データセル1-2</td>
<td>データセル1-3</td>
</tr>
<tr>
<td>データセル2-1</td>
<td>データセル2-2</td>
<td>データセル2-3</td>
</tr>
<tr>
<td>データセル3-1</td>
<td>データセル3-2</td>
<td>データセル3-3</td>
</tr>
</table>
<p>
表を右に配置して、
<br>
左側にテキストを回り込ませます。
<br clear="right">
回り込みを解除しました。
</p>
</div>
表示例
| データセル1-1 | データセル1-2 | データセル1-3 |
| データセル2-1 | データセル2-2 | データセル2-3 |
| データセル3-1 | データセル3-2 | データセル3-3 |
表を右に配置して、
左側にテキストを回り込ませます。
回り込みを解除しました。
■中央に配置した例
<table border="3" align="center">
<tr>
<td>データセル1-1</td>
<td>データセル1-2</td>
<td>データセル1-3</td>
</tr>
<tr>
<td>データセル2-1</td>
<td>データセル2-2</td>
<td>データセル2-3</td>
</tr>
<tr>
<td>データセル3-1</td>
<td>データセル3-2</td>
<td>データセル3-3</td>
</tr>
</table>
表示例
| データセル1-1 | データセル1-2 | データセル1-3 |
| データセル2-1 | データセル2-2 | データセル2-3 |
| データセル3-1 | データセル3-2 | データセル3-3 |
- サイト内検索
