卡片 · card-total 统计数字
卡片家族
索引
base
cpanel
crumb
full
page
border
radius
api
artic
namecode
imgs
tips
total
default
box
checkbox
form
form-item
form-inpselect
table
pager
multipled
menubar
mode
menus
tabmenu
code
json
template
tab
slide
paginate
tree
toggle
marquee
timeaxis
waterfall
popup
nav
chatbox
drag
choose
progress
roll
统计数字卡：主色边框 + 主色文字 + 圆角，专为仪表盘统计数字四件套设计；同组多个卡片通过
nth-child(12n+*) 自动 12 色相环轮换（hue-rotate）。
统计数字组
销售额
¥12,800
订单数
326
新客
98
退款
7
<div class="row">
<div class="card card-total col-sm-6 col-md-3">
<div class="card-head">销售额</div>
<div class="card-foot"><span class="label label-larger">¥12,800</span></div>
</div>
<div class="card card-total col-sm-6 col-md-3">...</div>
</div>
色相环依赖
nth-child，统计卡必须作为同一容器的直接兄弟（如上 .row 里直接放卡 + col 宽度类），不要再用 col 包裹一层，否则 12n 计数错位。
色相环机制
KuoqiUI v2.00 · 离线静态文档 · 界面基于 KuoqiUI ·
返回首页