CSS borderプロパティ
タグの定義と使用説明
border は枠線プロパティのショートハンドです。
CSS の border プロパティは、要素の枠線のスタイル、幅、色を指定するために使用します。
設定できるプロパティは(順番に)border-width、border-style、border-color です。
1つの値だけを設定することもできます。例:border:#FF0000;これは正しいです。他の値は対応するプロパティの初期値に設定されます。
構文形式
下記の1つ、2つ、または3つの値を使用して border プロパティを指定できます。値の順序は重要ではありません。
/* 枠線のスタイル */
border: solid;
/* 枠線の幅 | 枠線のスタイル */
border: 2px dotted;
/* 枠線のスタイル | 枠線の色 */
border: outset #f33;
/* 枠線の幅 | 枠線のスタイル | 枠線の色 */
border: medium dashed green;
/* グローバル値 */
border: inherit;
border: initial;
border: unset;
border: solid;
/* 枠線の幅 | 枠線のスタイル */
border: 2px dotted;
/* 枠線のスタイル | 枠線の色 */
border: outset #f33;
/* 枠線の幅 | 枠線のスタイル | 枠線の色 */
border: medium dashed green;
/* グローバル値 */
border: inherit;
border: initial;
border: unset;
注意:枠線のスタイルが定義されていない場合、枠線は表示されません。スタイルの初期値が none であるためです。
| 初期値: | not specified |
|---|---|
| 継承: | no |
| バージョン: | CSS1 |
| JavaScript 構文: | object object.style.border="3px solid blue" |
ブラウザサポート
表内の数字は、そのプロパティをサポートしている最初のブラウザのバージョン番号を示します。
| プロパティ | |||||
|---|---|---|---|---|---|
| border | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
プロパティ値
| 值 | 説明 |
|---|---|
| border-width | 枠線の幅を指定します。 |
| border-style | 枠線のスタイルを指定します。 |
| border-color | 枠線の色を指定します。 |
| inherit | 親要素から border プロパティの値を継承することを指定します。 |
関連記事
CSS チュートリアル:CSS ボーダー
その他の拡張