border-right
CSS属性 border-right 是属性border-right-color, border-right-style,和border-right-width的三者的缩写。这些属性都是在描述一个元素的右边的边框border。
示例
border-right: 1px; border-right: 2px dotted; border-right: medium dashed green;
border-right: 1px; border-right: 2px dotted; border-right: medium dashed green;
和CSS所有的缩写属性一样,border-right
总是会设置该缩写属性所包含的全部属性值,即使开发者并没有一一指定这些值。CSS缩写属性会给没有被定义的属性一个默认的属性值。那就意味着下面这个例子
border-right-style: dotted; border-right: thick green;
实际上应该是下面这个样子
border-right-style: dotted; border-right: none thick green;
并且在border-right
之前定义的border-right-style
的值也会被覆盖。由于border-right-style
的默认值是 none, border-style的最终结果就是没有边框。
浏览器支持
![]() | ![]() | ![]() | ![]() | ![]() |
浏览器都支持border-right |
语法
border-right :border-right-width||border-right-style||border-right-color
这三种属性值的缩写需要按照顺序定义数值,也可以省略其中的一个或者两个。
取值
- border-right-width:设置或检索对象边框宽度。取值
<length>
| thin| medium| thick。参见border-right-width
。 - border-right-style:设置或检索对象边框样式。取值 none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset。参见
border-right-style
。 - border-right-color:设置或检索对象边框颜色。参见
border-right-color
。
默认值 | |
适用于 | 所有元素 |
继承性 | 无 |
动画性 | 否 |
计算值 |
|
实例
<div> this box has a border on the right side. </div> div { border-right: 4px dashed blue; background-color: gold; height: 100px; width: 100px; font-weight: bold; text-align: center; }