手册
目录
border-color 属性用于设置四个边框的颜色。
可以通过以下方式设置颜色：
注释：如果未设置 border-color，则它将继承元素的颜色。
演示不同的边框颜色：
p.one {
border-style: solid;
border-color: red;
}
p.two {
border-style: solid;
border-color: green;
}
p.three {
border-style: dotted;
border-color: blue;
}
结果：
红色实线边框
绿色实线边框
蓝色点状边框
运行实例 »点击 "运行实例" 按钮查看在线实例
border-color 属性可以设置一到四个值（用于上边框、右边框、下边框和左边框）。
p.one {
border-style: solid;
border-color: red green blue yellow; /* 上红、右绿、下蓝、左黄 */
}
运行实例 »点击 "运行实例" 按钮查看在线实例
边框的颜色也可以使用十六进制值（HEX）来指定：
p.one {
border-style: solid;
border-color: #ff0000; /* 红色 */
}
运行实例 »点击 "运行实例" 按钮查看在线实例
或者使用 RGB 值：
p.one {
border-style: solid;
border-color: rgb(255, 0, 0); /* 红色 */
}
运行实例 »点击 "运行实例" 按钮查看在线实例
也可以使用 HSL 值：
p.one {
border-style: solid;
border-color: hsl(0, 100%, 50%); /* 红色 */
}
运行实例 »点击 "运行实例" 按钮查看在线实例
您可以在我们的 CSS 颜色 章节中学到有关 HEX、RGB 和 HSL 值的更多知识。
相关
视频
RELATED VIDEOS
科技资讯
1
2
3
4
5
6
7
8
9
精选课程
共5课时
17.2万人学习
共49课时
77万人学习
共29课时
61.7万人学习
共25课时
39.3万人学习
共43课时
70.9万人学习
共25课时
61.6万人学习
共22课时
23万人学习
共28课时
33.9万人学习
共89课时
125万人学习
