#border-bottom-style

#介绍

设置元件下边框的样式类型。需单独设置下边框样式时使用。

#使用示例

css-apisrc/border-bottom-style/App.tsx

Code

预览

#语法

border-bottom-style: dashed;

#取值

• none：无边框样式（边框宽度保持原值）
• hidden：隐藏边框（与 none 等效，表格布局时用于解决边框冲突）
• dotted：点状边框（实际显示为实线）
• dashed：虚线（实际显示为实线）
• solid：实线
• double：双线（总宽度等于 border-width 值）
• groove：3D 凹槽效果（效果依赖 border-color）
• ridge：3D 脊状效果（效果依赖 border-color）
• inset：内嵌效果（效果依赖 border-color）
• outset：外凸效果（效果依赖 border-color）

#形式定义

#形式语法

border-bottom-style = <line-style>
<line-style> = none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset

#与 Web 的区别

• MDN 参考
• 默认值不同（Web 为 none）
• 值为 none/hidden 时边框宽度保持原值（Web 会置为 0）
• 不支持 inherit/initial/revert/unset 全局值

#兼容性