border-style 该属性是用作规定元素所有边框的样式。
border-style: dashed border-style: dotted dashed border-style: hidden solid dashed border-style: none solid dashed none border-style: inherit border-style: initial border-style: unset
值 | 描述 |
---|---|
none | 此关键词表示不显示边框,同hidden类似。 |
hidden | 此关键词表示不显示边框,同none类似。 |
dotted | 此关键词表示显示一系列原点。两点之间的间隔大小,视不同实现而定。圆点半径是border-width计算值的一半。 |
dashed | 此关键词表示显示为一系列短的方形虚线。标准中没有定义线段的长度和大小,由实现而定。 |
solid | 此关键词表示显示为一条实线。 |
double | 此关键词表示显示为一条双实线,宽度是border-width。 |
groove | 此关键词表示显示为有雕刻效果的边框,样式同ridge相反。 |
ridge | 此关键词表示显示有浮雕效果的边框,样式同groove相反。 |
inset | 此关键词表示显示为友陷入效果的边框,样式与outset相反。当它指定到border-collapse的单元格时,会显示为groove的样式。 |
outset | 此关键词表示显示有突出效果的边框,样式与inset相反。当它指定到border-collapse为collapsed的单元格时,会显示为ridge的样式。 |
HTML
<div id="red"> </div>
CSS
#red { height: 200px; border: 2px red; border-style: dotted; }
执行结果
相关链接
外部链接