卡片 · card-toggle 折叠卡
卡片家族
索引
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
折叠卡
card-toggle:head 右侧箭头(kuoqi 收起 → 展开 ),body 由 height:0 切换展开;加 .open 为展开态。变体 toggle-normal:主色头 + 白字。引擎绑定 head 点击切换。
默认折叠
销售数据(展开)
body 内容:点击 head 折叠/展开,300ms 高度动画。
拜访记录
折叠时 body 高度为 0,完全隐藏。
<div class="card card-toggle open">
<div class="card-head"><span class="card-title">销售数据</span></div>
<div class="card-body">内容</div>
</div>
toggle-normal 风格
主色头风格
toggle-normal:主色底头部 + 白字,箭头仍为 kuoqi 字形。
<div class="card card-toggle toggle-normal open">
<div class="card-head"><span class="card-title">主色头风格</span></div>
<div class="card-body">内容</div>
</div>
KuoqiUI v2.00 · 离线静态文档 · 界面基于 KuoqiUI ·
返回首页