CSS border-left-color 属性

CSS border-left-color 属性技术文档

CSS border-left-color 属性用于设置元素的左边框颜色。

border-left-color: value;

value 参数可以接受 CSS 定义的颜色、RGB 值、十六进制值、HSL 值、或者transparent。同时，也可以使用关键字currentColor，表示使用与color属性相同的值。

颜色值，可以使用CSS定义的颜色值（如red等），RGB值、十六进制值、HSL值，或transparent。

.border{
    border-left: 5px solid;
    border-left-color: red;
}

border-left-color 属性可以接受 CSS 定义的颜色值（如red, blue, green 等等）。

也可以使用RGB 值和十六进制值来设置 border-left-color，以描述更具体的颜色。

.border{
    border-left-color: #000000;
    border-left-color: rgb(0,0,0);
}

可以通过HSL值来进行描述，HSL是一种基于人眼感知颜色的颜色描述方式。

.border{
    border-left-color: hsla(240, 50%, 50%, 0.5);
}

transparenet 表示设置为透明。

.border{
    border-left-color: transparent;
}

currentColor 关键字可以使用当前元素的 color 属性作为边框颜色。

.border{
    color: #000000;
    border-left-color: currentColor;
}

在使用 border-left-color 属性时，如果没有成功的更改边框颜色，那么可以检查下 border-left-width 和 border-left-style 是否设置正确，基本上必须有这两个属性才能生效。

用 CSS border-left-color 属性可以很方便地设置元素边框的左边颜色。在格外注重网站UI设计和可视化感的今天，这个属性的使用越来越普遍。