HTML テーブル要素のボーダーについて
HTMLで表を作成する際に使用する`table`要素ですが、シンプルに記述しただけだと、ブラウザ上では罫線が表示されません。罫線を表すにはCSSを使用するのが一般的ですが、`table`要素には、罫線の表示を制御するための属性が存在します。それが`border`属性です。
border属性
`table`要素に `border=""` を追加すると、表の外枠の太さを指定することができます。
<table border="1">
<thead>
<tr>
<th>見出し1</th>
<th>見出し2</th>
</tr>
</thead>
<tbody>
<tr>
<td>データ1</td>
<td>データ2</td>
</tr>
</tbody>
</table>
この属性の値に 1 以上を指定すると、全ての罫線(外枠と内罫線)が表示されます。数値が大きくなるほど外枠は太くなり、 0 を指定すると全ての罫線が表示されなくなります。
border属性の値と表示例
以下の表は、`border`属性の値と、ブラウザ上での表示例を示しています。
border 属性の値 | 表示例 | ||||
---|---|---|---|---|---|
border="0" |
|
||||
border="1" |
|
||||
border="2" |
|
注意点
`border`属性は、HTML5では非推奨となっており、代わりにCSSを使用することが推奨されています。ただし、簡単な表を作成する際や、HTML4以前の互換性を保つ必要がある場合には、`border`属性を使用することも可能です。
関連QA
Q1: border属性で罫線のスタイルを変更することはできますか?
A1: いいえ、`border`属性では罫線のスタイル(実線、点線など)を変更することはできません。罫線のスタイルを変更するには、CSSを使用する必要があります。
Q2: border属性で特定の罫線だけを表示することはできますか?
A2: いいえ、`border`属性では特定の罫線だけを表示することはできません。特定の罫線だけを表示するには、CSSを使用する必要があります。
Q3: CSSで罫線を設定する場合、border属性はどのように影響しますか?
A3: CSSで罫線を設定した場合、`border`属性の設定よりもCSSの設定が優先されます。そのため、CSSで罫線を設定する場合は、`border`属性は無視されます。