1. 首页
  2. 卡片 Card
  3. card-choose 选择卡

卡片 · card-choose 选择卡

卡片家族 索引 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-choose：模拟表单选项——body 2px 主色/灰边框 + 0.5rem 圆角；点击后加 choosed 转主色边 + 白字（正文靠遮罩底），choosed-err 追加红色半透明遮罩表示错误选中。引擎绑定点击互斥。
本页内容 状态示例

状态示例

标准卡（未选）
已选中 choosed
错误选中
<div class="card card-choose"><div class="card-body">选项</div></div> <div class="card card-choose choosed"><div class="card-body">已选</div></div> <div class="card card-choose choosed-err"><div class="card-body">错误</div></div>
提示： 互斥规则由引擎处理（切换 choosed）；choosed-err 的红色遮罩用 :before 铺满 body + z-index:-1，正常已选态无遮罩、白字直出。
上一张（循环） card-drag 拖拽
下一张 card-progress 进度
KuoqiUI v2.00 · 离线静态文档 · 界面基于 KuoqiUI · 返回首页