border-left-width - CSS（层叠样式表） 编辑

CSS 的 border-left-width 属性用来设置盒子的左边框的宽度。

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

语法

/* 关键字数值  */
border-left-width: thin;
border-left-width: medium;
border-left-width: thick;

/* 长度数值 */
border-left-width: 10em;
border-left-width: 3vmax;
border-left-width: 6px;

/* 全局关键字 */
border-left-width: inherit;
border-left-width: initial;
border-left-width: unset;

数值

<br-width>

定义边框的宽度，或者作为显性非负的长度值 <length> 或者是关键字. 如果他是一个关键字，它必须是下列值的一种：

thin		一个细边框
medium		一个中等边框
thick		一个粗边框

笔记: 因为规范没有定义每个关键字表示的确切厚度，当使用其中之一的关键字时，需要具体实施才知道确切结果。不过，它们通常遵循下面的模式 thin ≤ medium ≤ thick, 在单独文档中这些值内部是恒定不变的。

形式语法

<line-width>
where 
<line-width> = <length> | thin | medium | thick

例子

HTML

<div>Element 1</div>
<div>Element 2</div>

CSS

div {
  border: 1px solid red;
  margin: 1em 0;
}

div:nth-child(1) {
  border-left-width: thick;
}
div:nth-child(2) {
  border-left-width: 2em;
}

结果

规格

Specification	Status	Comment
CSS Backgrounds and Borders Module Level 3 border-left-width	Candidate Recommendation	没有规格变化.
CSS Level 2 (Revision 1) border-left-width	Recommendation	没有规格变化
CSS Level 1 border-left-width	Recommendation	最初的定义

初始值	medium
适用元素	all elements. It also applies to ::first-letter.
是否是继承属性	否
计算值	the absolute length or 0 if border-left-style is none or hidden
Animation type	a length

浏览器兼容性

BCD tables only load in the browser

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

其他

• The other border-width-related CSS properties: border-bottom-width, border-right-width, border-top-width, and border-width.
• The other border-left-related CSS properties: border, border-left, border-left-style, and border-left-color.