css border-color属性设置边框的颜色

border-color介绍

css border-color属性用来定义边框的颜色。此属性可以有一到四个值，各种情况如下：

如果提供全部四个参数值，将按上、右、下、左的顺序作用于四边。
如果只提供一个，将用于全部的四边。
如果提供两个，第一个用于上、下，第二个用于左、右。
如果提供三个，第一个用于上，第二个用于左、右，第三个用于下。
如果border-width等于0或border-style设置为none，本属性将被忽略。

注意：请始终把 border-style 属性声明到 border-color 属性之前。元素必须在您改变其颜色之前获得边框。

border-color属性值

css border-color属性的取值，可以使用十六进制颜色值，也可以使用颜色名称

值	说明
color	指定背景颜色。在CSS颜色值查找颜色值的完整列表
transparent	指定边框的颜色应该是透明的。这是默认
inherit	指定边框的颜色，应该从父元素继承

border-color实例

设置p元素四个边框颜色

<!DOCTYPE html>
<html>
<head>
<title>http://www.manongjc.com/article/1199.html</title>
<style>
p.one{
    border-style:solid;
    border-color:#0000ff;
}
p.two{
    border-style:solid;
    border-color:#ff0000 #0000ff;
}
p.three{
    border-style:solid;
    border-color:#ff0000 #00ff00 #0000ff;
}
p.four{
    border-style:solid;
    border-color:#ff0000 #00ff00 #0000ff rgb(250,0,255);
}
</style>
</head>
<body>
<p class="one">One-colored border!</p>
<p class="two">Two-colored border!</p>
<p class="three">Three-colored border!</p>
<p class="four">Four-colored border!</p>
<p><b>Note:</b> The "border-color" property does not work if it is used alone. Use the "border-style" property to set the borders first.</p>
</body>
</html>

在线运行