样式复用示例

方式 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 类。

这是一个链接

状态样式

在线
离线
忙碌

加载中...

Biya Dex - DEX Trading Platform