目录

style borderColor 属性

示例

将 <div> 元素的四个边框的颜色更改为红色:

document.getElementById("myDiv").style.borderColor = "red";
亲自试一试 »

下面有更多 "亲自试一试" 示例。


描述

borderColor 属性设置或返回元素边框的颜色。

该属性可以采用一到四个值:

  • 一个值,例如:p {border-color: red} - 所有四个边框均为红色
  • 两个值,例如: p {border-color: red transparent} - 顶部和底部边框将为红色,左右边框将为透明
  • 三个值,例如: p {border-color: red green blue} - 上边框为红色,左右边框为绿色,下边框为蓝色
  • 四个值,例如: p {border-color: red green blue Yellow} - 上边框为红色,右边框为绿色,下边框为蓝色,左边框为黄色

浏览器支持

表中的数字指定完全支持该属性的第一个浏览器版本。

Property
borderColor 1.0 4.0 1.0 1.0 3.5

语法

返回 borderColor 属性:

object.style.borderColor

设置边框颜色属性:

object.style.borderColor = "color|transparent|initial|inherit"

属性值

Value Description
color Specifies the color of the border. Look at CSS Color Values for a complete list of possible color values. Default color is the current color of the element
transparent The color of the border is transparent (underlying content will shine through)
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit


技术细节

默认值: 当前颜色
返回值: 一个字符串,表示元素边框的颜色
CSS版本 CSS1

更多示例

示例

将 <div> 元素的上下边框颜色更改为绿色,左右边框颜色更改为紫色:

document.getElementById("myDiv").style.borderColor = "green purple";
亲自试一试 »

示例

返回 <div> 元素的边框颜色:

alert(document.getElementById("myDiv").style.borderColor);
亲自试一试 »

相关页面

CSS教程:CSS 边框

CSS 参考:边框颜色属性

HTML DOM 参考:边境属性