样式复用示例
方式 1: CSS 类 (@apply)
基础卡片
使用 .card 类
悬停卡片
使用 .card-hover 类
渐变卡片
使用 .card-gradient 类
PrimarySuccessDangerWarningInfo
方式 2: 工具函数
默认卡片
getCardStyles('default')
悬停卡片
getCardStyles('hover')
边框卡片
getCardStyles('bordered')
PrimarySuccessDangerWarningInfoNeutral
方式 3: 共享组件
BTC/USDT
$45000.50
↑5.80%
24h 成交量: $2.5B
ETH/USDT
$3200.25
↓2.30%
24h 成交量: $1.2B
BNB/USDT
$320.80
↑0.50%
24h 成交量: $500M
混合使用
交易表单
响应式布局
2列网格
grid-2
响应式
移动端1列,平板2列
3列网格
3列网格
3列网格
4列
4列
4列
4列
文本样式
一级标题 Heading 1
二级标题 Heading 2
三级标题 Heading 3
四级标题 Heading 4
这是正文文本。Lorem ipsum dolor sit amet, consectetur adipiscing elit. 使用 .text-body 类。
这是小号文本。使用 .text-small 类。
这是淡化文本。使用 .text-muted 类。
状态样式
在线
离线
忙碌
加载中...