主题
  • 默认模式
  • 浅蓝色模式
  • 淡绿色模式
  • 深夜模式

定义和用法

border-bottom-style 是 CSS 中用于设置元素上边框样式的属性。

border-bottom-style 要使边框可见,必须同时设置 border-bottom-widthborder-bottom-color 或使用简写属性。

默认值: none
继承性:
可动画性: 支持。请参阅:可动画属性
版本: CSS1
JavaScript 语法: object.style.borderBottomStyle="dotted"

常用的实例

下面通过一些示例,让你更直观地了解 border-bottom-style 属性的用法:

实例代码 运行代码
复制
.example {
    border-bottom-style: dotted;   /* dotted - 点线边框 */
    border-bottom-style: dashed;   /* dashed - 虚线边框 */
    border-bottom-style: solid;    /* solid - 实线边框 */
    border-bottom-style: double;   /* double - 双线边框 */
    border-bottom-style: groove;   /* groove - 3D凹槽边框(效果取决于边框颜色) */
    border-bottom-style: ridge;    /* ridge - 3D凸脊边框(效果取决于边框颜色) */
    border-bottom-style: inset;    /* inset - 3D内嵌边框(效果取决于边框颜色) */
    border-bottom-style: outset;   /* outset - 3D外凸边框(效果取决于边框颜色) */
    border-bottom-style: none;     /* none - 无边框 */
    border-bottom-style: hidden;   /* hidden - 隐藏边框(在表格中与none表现不同) */
}

CSS 语法

border-bottom-style: none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset;

属性值

描述
none 无边框(默认值)。
hidden 与 "none" 类似,但在表格边框冲突解决中有不同表现。
dotted 定义点状边框。
dashed 定义虚线边框。
solid 定义实线边框
double 定义双线边框。
groove 3D凹槽边框(效果取决于边框颜色)。
ridge 3D凸脊边框(效果取决于边框颜色)。
inset 3D内嵌边框(效果取决于边框颜色)。
outset 3D外凸边框(效果取决于边框颜色)。

浏览器支持

表中的数字指定了完全支持border-bottom-style属性的第一个浏览器版本。

Chrome 浏览器 EDGE 浏览器 Firefox 浏览器 Safari 浏览器 Opera 浏览器
Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 9.2

相关页面

CSS 教程:CSS 边框

CSS 参考手册:CSS border-style 属性

CSS 参考手册:CSS border-top-style 属性

CSS 参考手册:CSS border-right-style 属性

CSS 参考手册:CSS border-left-style 属性



评论区 0
发表评论
教程介绍
CSS 参考手册全面涵盖选择器、盒模型,文本属性等,助您快速检索 CSS 使用方法。
87 章节
18 阅读
0 评论
教程目录

CSS 参考手册

CSS 属性(字母排序) CSS 属性(功能排序) CSS 浏览器支持 CSS 选择器 CSS 函数 CSS 可动画性 CSS Web安全字体 CSS 单位 CSS 颜色 CSS 颜色值

CSS 属性

align-content align-items align-self all animation animation-delay animation-direction animation-duration animation-fill-mode animation-iteration-count animation-name animation-play-state animation-timing-function aspect-ratio backdrop-filter backface-visibility background background-attachment background-blend-mode background-clip background-color background-image background-origin background-position background-position-x background-position-y background-repeat background-size block-size border border-block border-block-color border-block-end border-block-end-color border-block-end-style border-block-end-width border-block-start border-block-start-color border-block-start-style border-block-start-width border-block-style border-block-width border-bottom border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-collapse border-color border-end-end-radius border-end-start-radius border-image border-image-outset border-image-repeat border-image-slice border-image-source border-image-width border-inline border-inline-color border-inline-end border-inline-end-color border-inline-end-style border-inline-end-width border-inline-start border-inline-start-color border-inline-start-style border-inline-start-width border-inline-style border-inline-width border-left border-left-color border-left-style border-right-style border-top-left-radius border-top-right-radius border-top-style