CSSボーダーサイド
CSSボーダー-個々の側面
前のページの例から、各辺に異なる境界線を指定できることがわかりました。
CSSには、各境界線（上、右、下、左）を指定するためのプロパティもあります。
例
p
{
border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dotted;
border-left-style: solid;
}
結果：
Different Border Styles
上記の例では、次と同じ結果が得られます。
例
p {
border-style: dotted solid;
}
だから、これがどのように機能するかです：
border-styleプロパティに4つの値がある場合：
- ボーダースタイル：点線の実線の二重破線。
- 上枠が点線
- 右の境界線はしっかりしています
- 下の境界線は2倍です
- 左の境界線は破線です
border-styleプロパティに3つの値がある場合：
- ボーダースタイル：点線の実線のダブル。
- 上枠が点線
- 左右の境界線はしっかりしています
- 下の境界線は2倍です
border-styleプロパティに2つの値がある場合：
- ボーダースタイル：点線の実線。
- 上と下の境界線は点線です
- 左右の境界線はしっかりしています
border-styleプロパティに1つの値がある場合：
- ボーダースタイル：点線;
- 4つの境界線すべてが点線で示されています
例
/* Four values */
p {
border-style: dotted solid double dashed;
}
/* Three
values */
p {
border-style: dotted solid double;
}
/* Two values */
p {
border-style: dotted solid;
}
/* One value */
p {
border-style: dotted;
}
上記border-styleの例では、プロパティが使用されています。ただし、とでも機能し
border-width
ますborder-color。