卡片 · card-base 基类
所有卡片共用的基类：
card（display:block），自带 --radius-md 8px 圆角与阴影过渡。卡内三区 card-head / card-body / card-foot 是上下文选择器，父级有 card 即可生效。
卡片家族
索引
base
cpanel
crumb
full
page
border
radius
api
artic
namecode
imgs
tips
total
default
box
checkbox
form
form-item
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
基类结构与三区
标题
内容
底部
<div class="card">
<div class="card-head">标题</div>
<div class="card-body">内容</div>
<div class="card-foot">底部</div>
</div>
整块链接卡
点击进入卡片索引页
<a class="card" href="../card.html">
<div class="card-body">点击进入卡片索引页</div>
</a>
形态变体
| card-inline | 行内块显示，可并排多张卡 |
| card-small | 字号缩小为 small，紧凑内容 |
| card-canclick | cursor:pointer，可点击提示 |
| .active | 激活态阴影（box-shadow: 1px 1px 2px） |
| card-init | 居中限宽展示容器（文档用途居多） |
inline 卡一
inline 卡二
card-small 小字号内容
<div class="card card-inline"><div class="card-body">inline 卡一</div></div>
<div class="card card-inline mgreml-4"><div class="card-body">inline 卡二</div></div>
<div class="card card-small"><div class="card-body">card-small 小字号内容</div></div>
<div class="card card-canclick active"><div class="card-body">可点击 + 激活态</div></div>
aminate-shadow 入场阴影
淡入 + 投影的卡片
<div class="card card-aminate-shadow">
<div class="card-body">淡入 + 投影的卡片</div>
</div>
KuoqiUI v2.00 · 离线静态文档 · 界面基于 KuoqiUI ·
返回首页