トップページの中の プロパティの中の Bのプロパティ一覧の中の border-top-color, border-right-color, border-bottom-color, border-left-color

border-top-color, border-right-color, border-bottom-color, border-left-color

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

各辺のボーダーの色を個別に指定できるプロパティです。

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

プロパティの解説

<色>|transparent|inherit
初期値
colorプロパティの値
適用される要素
全ての要素
継承
しません
パーセント値
N/A
メディア
visual

値の解説

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

border-color個別指定のサンプル

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

p.sample {
  border-top-color: transparent;
  border-right-color: green;
  border-bottom-color: #006;
  border-left-color: green;
}

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

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

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

このページの上部へ