　枠線の色を指定する

■border-color:

指定できる値

RGB値で指定

#RRGGBBやRGB(n%、n%,n%)など

カラー名

redやblueなど

システムカラーで指定

値の指定方法		個別に設定するプロパティ
値が一つ	上下左右同じ設定	border-top-color	上のみ設定
値が二つ	上下、左右の設定	border-left-color	左のみ設定
値が三つ	上と左右と下の設定	border-right-color	右のみ設定
値が四つ	上、右、下、左の順で設定	border-bottom-color	下のみ設定

枠線の色を設定するには、border-colorプロパティを使います。値はRGB値やカラー名で指定します。

この属性も前で説明した、border-styleプロパティのように値を半角のスペースで区切り複数指定することや、border-top-colorプロパティのような、よく似たプロパティで、上下左右それぞれについて枠線の色を設定することが出来ます。

border-top-colorプロパティの場合は、上だけの枠線の色を指定できます。

サンプル - Microsoft Internet Explorer

緑色の枠線です

オレンジの枠線です

上下がオレンジで、左右が緑色です

HTML&CSS

<html>
<head>
<title>サンプル</title>
<style type="text/css">
<!--
p{ border-width: 5px ;
   padding:4px;}
.test1 { border-style: solid; 
         border-color:green;}
.test2 { border-style: double; 
         border-color:orange;  }
.test3 { border-style: solid; 
         border-color:orange green;}
-->
</style>
</head>
<body>
<p class="test1">緑色の枠線です</p>
<p class="test2">オレンジの枠線です</p>
<p class="test3">
上下がオレンジで、左右が緑色です
</p>
</body>
</html>