- CSS: border-style, outline-style

ボックスの枠線の指定

CSS で border-style 属性を指定すると、ボックスの枠線のスタイルを変更することができる。outline-style 属性を指定すると、アウトラインのスタイルを変更できる。

p { border-style: solid; }

p { border-top-style: solid; }

p { border: #000000 1px solid; }

p { border-top: #000000 1px solid; }

p { outline-style: solid; }

p { outline: #000000 1px solid;

下に border-styleoutline-style 属性の要素を羅列した。効果を判別しやすくするため、背景を薄いグレーにしている。それぞれのブラウザで表示を確認するときに便利だろう。

border-style

border-style: none;

border-style: hidden;

border-style: solid;

border-style: dashed;

border-style: dotted;

border-style: double;

border-style: groove;

border-style: ridge;

border-style: inset;

border-style: outset;

outline-style

outline-style: none;

outline-style: hidden;

outline-style: solid;

outline-style: dashed;

outline-style: dotted;

outline-style: double;

outline-style: groove;

outline-style: ridge;

outline-style: inset;

outline-style: outset;