Border 边框

我们对边框进行统一规范，可用于按钮、卡片、弹窗等组件。

// Border 是 CSS 设计变量，无需引入任何组件。

边框样式

我们提供以下几种边框样式，以供选择。

圆角

我们提供以下几种圆角样式，以供选择。

阴影

我们提供以下几种阴影样式，以供选择。

API

边框 CSS 变量

名称	默认值
--el-border-width	1px
--el-border-style	solid
--el-border-color	#CCCCCC
--el-border-color-light	#E0E0E0

圆角 CSS 变量

名称	默认值
--dh-radius-2	2px
--dh-radius-4	4px
--dh-radius-6	6px
--dh-radius-8	8px
--dh-radius-12	12px
--dh-radius-16	16px
--dh-radius-full	9999px

阴影 CSS 变量

名称	默认值
--el-box-shadow	0 12px 32px 4px rgba(0, 0, 0, .04), 0 8px 20px rgba(0, 0, 0, .08)
--el-box-shadow-light	0 0 12px rgba(0, 0, 0, .12)
--el-box-shadow-lighter	0 0 6px rgba(0, 0, 0, .12)
--el-box-shadow-dark	0 16px 48px 16px rgba(0, 0, 0, .08), 0 12px 32px rgba(0, 0, 0, .12), 0 8px 16px -8px rgba(0, 0, 0, .16)

参见 Element Plus Border 文档。