最終更新日
border-styleは、上下左右の罫線の種類をまとめて設定するプロパティです。値を4個指定した場合、4つの値は、上、右、下、左の罫線の種類をそれぞれ順に表します。
・値が3個の場合は、左右の罫線が同じ値を示す
・値が2個の場合は、上下、左右の罫線がそれぞれ同じ値を示す
・値が1個の場合は、上下左右の罫線がすべて同じ値を示す
初期値 | 適用先 | 継承 |
---|---|---|
各プロパティの初期値 | すべての要素 | なし |
値 | 説明 | 表示例 |
---|---|---|
none | 罫線を引かない。border-colorやborder-widthの値は無視されます。(初期値) | none |
hidden | 罫線を表示しません。noneとほぼ同等です。 | |
dotted | 点線 | dotted |
dashed | 破線 | dashed |
solid | 実線 | solid |
double | 二重線 | double |
groove | 立体的に窪んだ線 | groove |
ridge | 立体的に隆起した線 | ridge |
inset | ボックス全体が窪んだようにみえる囲み線 | inset |
outset | ボックス全体が隆起したようにみえる囲み線 | outset |
border-style: solid; border-style: solid solid; border-style: solid solid solid; border-style: solid solid solid solid;