CSS | border-left 属性

border-left 属性用于设置元素左边框的样式、宽度和颜色。该属性可以通过简写或者分别设置边框样式、宽度和颜色来使用。

语法

border-left: border-width border-style border-color;

或者

border-left-width: value;
border-left-style: value;
border-left-color: value;

属性值

• border-width：边框的宽度，可取任何长度或预定义的 CSS 值。默认为 medium。
• border-style：边框的样式，可取预定义的样式值或自定义值。默认为 none。
• border-color：边框的颜色。默认为元素的字体颜色。

示例

设置边框样式、宽度和颜色

div {
  border-left: 2px dotted blue;
}

该示例会在 div 元素的左边框上设置一个宽度为 2 像素、样式为虚线、颜色为蓝色的边框。

分别设置边框样式、宽度和颜色

div {
  border-left-width: 2px;
  border-left-style: dotted;
  border-left-color: red;
}

该示例会在 div 元素的左边框上设置一个宽度为 2 像素、样式为虚线、颜色为红色的边框。

浏览器支持

| IE | Edge | Firefox | Chrome | Safari | | ---- | ---- | ------- | ------ | ------ | | 5.5+ | 12+ | 1.0+ | 1.0+ | 1.0+ |

总结

border-left 属性用于设置元素的左边框样式、宽度和颜色。该属性可以通过简写或者分别设置边框样式、宽度和颜色来使用。在有需要时，开发者可以使用这种方法快速轻松地样式化元素的边框。