border-right-width
**border-right-width
** CSS 属性设置元素右侧边框的宽度。
试一试
语法
css
/* Keyword values */
border-right-width: thin;
border-right-width: medium;
border-right-width: thick;
/* <length> values */
border-right-width: 10em;
border-right-width: 3vmax;
border-right-width: 6px;
/* Global keywords */
border-right-width: inherit;
border-right-width: initial;
border-right-width: revert;
border-right-width: revert-layer;
border-right-width: unset;
值
<line-width>
-
定义边框的宽度,可以是显式非负
<length>
或关键字。如果为关键字,则必须为以下值之一thin
medium
thick
**注意:**由于规范没有定义每个关键字所表示的精确厚度,因此使用其中一个关键字时,精确结果是特定于实现的。但是,它们始终遵循模式 thin ≤ medium ≤ thick
,并且值在单个文档中是恒定的。
正式定义
初始值 | medium |
---|---|
应用于 | 所有元素。它也适用于 ::first-letter 。 |
继承 | 否 |
计算值 | 如果 border-right-style 为 none 或 hidden ,则为绝对长度或 0 |
动画类型 | 一个 长度 |
正式语法
border-right-width =
<line-width>
<line-width> =
<length [0,∞]> |
thin |
medium |
thick
示例
比较边框宽度
HTML
html
<div>Element 1</div>
<div>Element 2</div>
CSS
css
div {
border: 1px solid red;
margin: 1em 0;
}
div:nth-child(1) {
border-right-width: thick;
}
div:nth-child(2) {
border-right-width: 2em;
}
结果
规范
规范 |
---|
CSS 背景和边框模块级别 3 # the-border-width |
浏览器兼容性
BCD 表格仅在浏览器中加载
另请参阅
- 其他与边框宽度相关的 CSS 属性:
border-bottom-width
、border-left-width
、border-top-width
和border-width
。 - 其他与 border-right 相关的 CSS 属性:
border
、border-right
、border-right-style
和border-right-color
。