トップページの中の プロパティの中の Bのプロパティ一覧の中の border-color

border-color

  • 最終更新:2009年11月10日 14:28

border-colorプロパティは、上下左右のボーダーの色を一括で指定できます。
各値は、半角スペースなどの空白類文字で区切って書きます。

対応ブラウザ
  • IE6一部対応
  • IE7対応
  • IE8対応
  • Firefox3.5対応
  • Opera10対応
  • Safari4対応
  • Chrome3対応

プロパティの解説

[ <色>|transparent ]{1,4}|inherit
初期値
個別のプロパティを参照します
適用される要素
全ての要素
継承
しません
パーセント値
N/A
メディア
visual

値の解説

<色>
キーワード(red, blueなど)かRGB数値のいずれかで指定できます。
transparent
ボーダー領域を透明にする。この際ボーダー幅は確保されます。
なお、IE6はtransparentに対応していません。

border-colorのサンプル

p {
  margin: 10px;
  padding: 5px;
  border-style: solid;
}

p.sample01 {
  border-color: red #ccc #006 #606;
}

p.sample02 {
  border-color: #960 #000 #060;
}

p.sample03 {
  border-color: #999;
}

このサンプルを今見ているブラウザで表示すると以下のようになります。

サンプルのブラウザ上の表示

ボーダーのサンプルです。

ボーダーのサンプルです。

ボーダーのサンプルです。

このページの上部へ