定义和用法
该属性设置元素底部边框的样式。border-bottom-style
例为底部边框设置样式:
div {border-bottom-style: dotted;}
CSS 语法
border-bottom-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
属性值
- none:定义无边框。这是默认设置
- hidden:与“none”相同,但在表元素的边界冲突解决中除外
- doted:指定虚线边框
- dash:指定虚线边框
- solid:指定实心边框
- double:指定双边框
- groove:指定三维带槽边框。效果取决于边框颜色值
- ridge:指定三维脊状边框。效果取决于边框颜色值
- inset:指定三维插入边框。效果取决于边框颜色值
- beginn:指定三维起点边框。效果取决于边框颜色值
- initial:将此属性设置为默认值。阅读初始
- inherit:从其父元素继承此属性。阅读继承
示例
底部虚线边框:
div {border-bottom-style: dashed;}
实心底部边框:
div {border-bottom-style: solid;}
双底部边框:
div {border-bottom-style: double;}
删除底部边框:
div {border-bottom-style: none;}
凹槽底部边框:
div {
border-bottom-style: groove;
border-bottom-color: coral;
border-bottom-width: 7px;
}
山脊底部边界:
div {
border-bottom-style: ridge;
border-bottom-color: coral;
border-bottom-width: 7px;
}
插入的底部边框:
div {
border-bottom-style: inset;
border-bottom-color: coral;
border-bottom-width: 7px;
}
外出的底部边框:
div {
border-bottom-style: outset;
border-bottom-color: coral;
border-bottom-width: 7px;
}