Skip to content

Border

CSS 的 border 是设置元素边框属性的简写形式。

边框样式

Class属性描述
border-r-solidborder-right-style: solid;显示为一条实线
border-r-dashedborder-right-style: dashed;显示为一系列短的方形虚线
border-r-dottedborder-right-style: dotted;显示为一系列圆点
border-r-noneborder-right-style: none;不显示边框

边框宽度

Class属性描述
border-rborder-right-width: 1px;宽度为1px
border-r-0border-right-width: 0px;宽度为0px
border-r-1border-right-width: 1px;宽度为1px
border-r-2border-right-width: 2px;宽度为2px
border-r-3border-right-width: 3px;宽度为3px
border-r-4border-right-width: 4px;宽度为4px
border-r-5border-right-width: 5px;宽度为5px
border-r-6border-right-width: 6px;宽度为6px
border-r-7border-right-width: 7px;宽度为7px
border-r-8border-right-width: 8px;宽度为8px
border-r-9border-right-width: 9px;宽度为9px
border-r-10border-right-width: 10px;宽度为10px

边框色彩

主色

主题
primary
#604CFC

辅助色

成功
success
#07C160
警告
warning
#EDA20C
危险
danger
#D9514C

中性色

grey-1
#ffffff
grey-2
#f7f8fa
grey-3
#f2f3f5
grey-4
#e5e6eb
grey-5
#c9cdd4
grey-6
#a9aeb8
grey-7
#86909c
grey-8
#6b7785
grey-9
#4e5969
grey-10
#272e3b
grey-11
#1d2129
grey-12
#141414

内置色彩

Red / 浪漫红
red
#F53F3F
Orange Red / 晚秋红
orangered
#F77234
Orange / 活力橙
orange
#FF7D00
Gold / 黄昏
gold
#F7BA1E
Yellow / 柠檬黄
yellow
#FADC19
Lime / 新生绿
lime
#9FDB1D
Green / 仙野绿
green
#00B42A
Cyan / 碧涛青
cyan
#14C9C9
Blue / 海蔚蓝
blue
#3491FA
Arco Blue / 极致蓝
arcoblue
#165DFF
Purple / 暗夜紫
purple
#722ED1
Pink Purple / 青春紫
pinkpurple
#D91AD9
Magenta / 品红
magenta
#F5319D