このスタイルについて
　ボックスの枠線を操作します。属性はborderの言葉の後に続けてtop, bottom, left, rightのボーダーの位置を、その後にstyle, color, widthの枠線のデザインを、-（ハイフン）でつなげることで決定します。

文例
border-top-width：上部のボーダーのサイズを指定します。
border-bottom：下部のボーダーのサイズ、色、スタイルをこの順に指定します。
border-color：四方のボーダーの色を指定します。
border四方のボーダーのサイズ、色、スタイルをこの順に指定します。

また、続けて書くべき言葉を省略することで、省略された箇所に該当する全ての要素に対して効果を与えます。
border-colorという属性は、border-top-color, border-bottom-color, border-left-color, border-right-colorの4つの属性と等価。 すこし分かりづらい説明になってしまいました。サンプルを参考に練習してみてください。

実行例

下線として破線を使うにはこの属性を使用します。

関連


対応ブラウザ
WIN IE 4.0〜 NN 6.0〜　MAC IE 4.0〜 NN 6.0〜

サンプルソース [CSS] p { border : 5px #CC0000 solid; background-color : #FFFFCC; } h1 { border-left : 20px #0000FF solid; border-bottom : 1px #0000FF solid; } #emphasis { border-bottom-style : dashed; border-bottom-color : #000000; border-bottom-width : 1px; } [HTML] <span style="border-bottom:1px #000000 dashed">下線に破線を適用</span>

ユーザ設定
styleのつく属性に設定できる値には、以下のようなものがあります。
none, hidden：枠線を表示しない
solid：通常の枠線
double：二重の枠線
groove, ridge, inset, outset：立体的な枠線
dashed：破線を表示（IEは5.5以上）
dotted：点線を表示（IEは5.5以上）