# border

3 位贡献者：

### Summary

CSS的border属性是一个用于设置各种单独的边界属性的简写属性`border可以用于设置一个或多个以下属性的值：` `border-width`, `border-style`, `border-color`

• 初始值 the concatenation of the initial values of its longhand properties:
• `border-width`: the concatenation of the initial values of its longhand properties:
• `border-top-width`: `medium`
• `border-right-width`: `medium`
• `border-bottom-width`: `medium`
• `border-left-width`: `medium`
• `border-style`: the concatenation of the initial values of its longhand properties:
• `border-top-style`: `none`
• `border-right-style`: `none`
• `border-bottom-style`: `none`
• `border-left-style`: `none`
• `border-color`: the concatenation of the initial values of its longhand properties:
• `border-top-color`: `currentColor`
• `border-right-color`: `currentColor`
• `border-bottom-color`: `currentColor`
• `border-left-color`: `currentColor`
• 适用元素 all elements. It also applies to `::first-letter`.
• 是否是继承属性 no
• 适用媒体 `visual`
• 计算值 as each of the properties of the shorthand:
• `border-width`: as each of the properties of the shorthand:
• `border-style`: as each of the properties of the shorthand:
• `border-bottom-style`: as specified
• `border-left-style`: as specified
• `border-right-style`: as specified
• `border-top-style`: as specified
• `border-color`: as each of the properties of the shorthand:
• `border-bottom-color`: If the value is translucent, the computed value will be the `rgba()` corresponding one. If it isn't, it will be the `rgb()` corresponding one. The `transparent` keyword maps to `rgba(0,0,0,0)`.
• `border-left-color`: If the value is translucent, the computed value will be the `rgba()` corresponding one. If it isn't, it will be the `rgb()` corresponding one. The `transparent` keyword maps to `rgba(0,0,0,0)`.
• `border-right-color`: If the value is translucent, the computed value will be the `rgba()` corresponding one. If it isn't, it will be the `rgb()` corresponding one. The `transparent` keyword maps to `rgba(0,0,0,0)`.
• `border-top-color`: If the value is translucent, the computed value will be the `rgba()` corresponding one. If it isn't, it will be the `rgb()` corresponding one. The `transparent` keyword maps to `rgba(0,0,0,0)`.
• 是否适用于 CSS 动画 as each of the properties of the shorthand:
• `border-color`: as each of the properties of the shorthand:
• `border-bottom-color`: yes, as a color
• `border-left-color`: yes, as a color
• `border-right-color`: yes, as a color
• `border-top-color`: yes, as a color
• `border-style`: no
• `border-width`: as each of the properties of the shorthand:
• `border-bottom-width`: yes, as a length
• `border-left-width`: yes, as a length
• `border-right-width`: yes, as a length
• `border-top-width`: yes, as a length
• 正规顺序 order of appearance in the formal grammar of the values

### 语法

```border: [border-width ||border-style ||border-color |inherit] ;
```

### 取值

border-width

border-style

border-color
`<color>` 可以确定border的颜色。如果这个值没有设置，它的默认值是元素的`color`属性值（是文字颜色而非背景色）。 请看`border-color`.

### 例子

```element {
border: 1px solid #000;
}
```

## 规范

CSS Backgrounds and Borders Module Level 3
border
Candidate Recommendation 在理论上删除了对`transparent`的支持，因为`<color>`已经接受它作为一种有效的颜色值。这不会对实际使用有任何影响。

CSS Level 2 (Revision 1)
border
Recommendation

CSS Level 1
border
Recommendation