- 首页
- 组件
- 卡片 Card
卡片 Card
卡片是内容容器，基类
card（display:block），变体控制配色与头部样式；结构为 card-head + card-body (+ card-foot)。全家族约 44 种卡片形态，每个变体均有独立详情页，见下文索引。
基础结构
<div class="card">
<div class="card-head">标题</div>
<div class="card-body">内容</div>
</div>
card-cpanel：控制面板
<div class="card card-cpanel">
<div class="card-head">控制台</div>
<div class="card-body">内容</div>
</div>
cpanel 的头部文字直接写普通文本即可，不要套 label 状态类。变体与写法见 card-cpanel 详情页。
代码块：card-code
<div class="card card-code code-html">
<div class="card-head">HTML 代码</div>
<p>代码内容，按 < 转义</p>
</div>
card-code / card-json 由交互引擎自动初始化并重建内部内容，卡片内直接放 <pre> 会被引擎改写而不符合预期；源码必须按 < 转义（写成 <），浏览器解析后才能保留原样。详见 card-code 详情页。
卡片索引（44 个详情页）
KuoqiUI v2.00 · 离线静态文档 · 界面基于 KuoqiUI ·
返回首页