CSS的border属性设置元素边框的所有四个侧面的宽度,样式和颜色。它是用于单独设置边框属性,即一个速记属性,而border-width,border-style以及border-color是一个单一的声明。
下表总结了此属性的用法上下文和版本历史记录。
默认值: | 查看个别属性 |
---|---|
适用于: | 所有元素 |
继承: | 没有 |
可动画制作: | 是的,请参考单个属性。请参考 动画属性。 |
版本: | CSS 1,2,3 |
JavaScript 语法: | object object.style.border="1px solid red" |
该属性的语法如下:
border: [ border-width border-style border-color ] | initial | inherit
注意:如果上面列出的任何属性均缺失或省略,则将插入该属性的默认值(如果有的画)。有关详细信息,请参见各个属性。
下面的示例演示了如何使用border属性。
h1 { border: 5px solid #ff0000;} p { color: #00ff00;border: 5px solid;}测试看看
注意:如果border-color缺少或未指定(例如border: 5px solid;),color则将使用元素属性的值。但是,在有border-style情况下,跳过或忽略该值将不会显示任何边框,因为border-style 属性的默认值为none。
下表描述了此属性的值。
值 | 描述 |
---|---|
border-width | 设置元素边框的宽度。 |
border-style | 设置元素边框的线型。 |
border-color | 设置元素边框的颜色。 |
initial | 将此属性设置为其默认值。 |
inherit | 如果指定,则关联元素采用其父元素border属性的计算值。 |
border属性浏览器的兼容性,所有主流浏览器均支持该属性。
|
参见教程:CSS Border,CSS3 Border。
相关属性:border-width,border-style,border-color,border-collapse,border-image,border-radius,border-spacing。