プロパティ名説明適用対象継承
border-top-style:種類上の枠線の種類すべての要素なし
border-bottom-style:種類下の枠線の種類すべての要素なし
border-left-style:種類左の枠線の種類すべての要素なし
border-right-style:種類右の枠線の種類すべての要素なし
border-style:種類上下左右の枠線の種類すべての要素なし
  
説明
枠線の種類dotted点線で表示
dashed破線で表示
solid実践で表示
double二重線で表示
groove凹んで見えるような線で表示
ridge浮き出して見えるような線で表示
inset枠線の内側が凹んで見えるような線
で表示
outset枠線の内側が浮き出して見えるような線
で表示
hidden枠線を非表示にします
none枠線を非表示にします。
枠線の幅(border-width)も0になります
(デフォルト)
border-color:枠線の色
border-style:値上下左右
border-style:値 値上下 左右
border-style:値 値 値上下 左右 下
border-style:値 値 値 値上 右 下 左
border-top-style, border-bottom-style, border-left-style, border-right-style,border-styleプロパティは、枠線の種類を設定します。
border-colorを利用すると、上下左右の枠線の種類を一度に設定することができます。
値を半角スペースで区切って指定しますが、与えられた値の個数によって、上記のように枠線の色が設定されます。

box_sampl05.gif

サンプルソース
【CSS】 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <style type="text/css"> <!-- body{margin:0} p{text-align:center; font-size:1.1em; background-color:#FFD700; color:red; width:600px; margin-left:auto; margin-right:auto; border-width: 5px; border-color:red;} b{font-size:1.2em; color:black; } #sampl01{border-style: dashed;} #sampl02{border-style: solid;} #sampl03{border-style: double;} #sampl04{border-style: groove; } #sampl05{border-style: ridge;} #sampl06{border-style: inset;} #sampl07{border-style: outset; } #sampl08{border-style: hidden;} #sampl09{border-style: none;} --> </style> </head> 【HTML】 <body> <p id="sampl01"><b>上下左右ボーダー破線で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl02"><b>上下左右ボーダー実践で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl03"><b>上下左右ボーダー二重線で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl04"><b>上下左右ボーダー凹んで見えるような線で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl05"><b>上下左右ボーダー浮き出して見えるような線で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl06"><b>上下左右ボーダー枠線の内側が凹んで見えるような線で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl07"><b>上下左右ボーダー枠線の内側が浮き出して見えるような線で表示</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl08"><b>枠線を非表示にします</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> <p id="sampl09"><b>枠線を非表示にします。枠線の幅(border-width)も0になります</b> 日光東照宮(にっこうとうしょうぐう)は栃木県日光市にある神社。</p> </body> </html>