borderプロパティ

borderプロパティの概要
機能	ボーダー（枠線）の定義
指定可能な値	色、border-style, border-widthの値
初期値	色はcolorプロパティによる、スタイルは「none」、太さは、「medium」
継承	しない
適用可能なボックス	全て

borderプロパティは、要素の4辺全てのボーダー（枠線）のスタイルを定義します。枠線のスタイルについては、border-styleを参照してください。また、要素にcolorプロパティが定義されていると、枠線にその色が使用されます。


h2 {
    border: solid;
}
div {
    color: #090;
    border: double;
}

枠線の一括指定

borderの値をスペースで区切って、複数指定すると、枠線の太さ、スタイル、色を一括して設定することができます。値を記述する順番は、どのような順番でも構いません。

borderプロパティの使用には、この方法が最もよく使用される方法だと思います。


h2 {
    border: 1px solid #900;
}
div {
    border: dotted thick #900;
}
h3 {
    border: pink double 8px;
}

上下左右の枠線を個別に設定する場合には、border-top等のプロパティを使用します。

以下に、その他のborder関連プロパティを紹介します。ただし、通常、使用されるのは、border-top, border-right, border-bottom, border-left程度です。その他のプロパティについては、参考程度に留めてください。