CSS | border-inline-start-width 属性

简介

border-inline-start-width 属性是用来设置盒子的内联起始端（inline-start）边框的宽度的CSS属性。内联起始端的方向在LTR（从左到右的文本）中为左侧，而在RTL（从右到左的文本）中为右侧。

语法

border-inline-start-width: thin | medium | thick | <length> | <percentage>

• thin：设置边框宽度为细（1像素）
• medium：设置边框宽度为中等（3像素）
• thick：设置边框宽度为粗（5像素）
• <length>：指定一个精确的边框宽度。默认单位为像素。
• <percentage>：相对于边框区块容器的宽度，指定一个边框宽度的百分比。注意：只有在盒子有宽度时才能使用百分比。

实例

以下示例展示了如何使用 border-inline-start-width 属性：

p {
  border-inline-start-width: 5px;
}

上述代码将在段落的内联起始端（inline-start）添加一个 5 像素宽的边框。

p {
  border-inline-start-width: 20%;
}

上述代码将在段落的内联起始端（inline-start）添加一个相对于容器宽度为 20% 的边框。

浏览器兼容性

border-inline-start-width 属性是CSS3规范中的一部分，在一些较老版本的浏览器中可能无法正常工作。为了达到最好的浏览器兼容性，建议在使用之前检查 caniuse.com。

参考链接

• CSS4: Borders (W3C)
• border-inline-start-width (MDN)