卡片 · card-popup 弹出层
卡片家族
索引
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-popup:固定定位弹层,网格三行 head/body/foot,半透明白底、圆角、1px 灰描边 + 阴影、max-height:80%、z-index:6519;配合引擎的显示 / 关闭 / 拖动逻辑使用。
本页内容
结构
结构
<div class="card card-popup">
<div class="card-head">
<span class="label label-text">标题</span>
<i class="popup-close">✕</i>
</div>
<div class="card-body">弹层内容</div>
<div class="card-foot">
<button type="button" class="btn btn-index btn-small">确定</button>
</div>
</div>
| position:fixed | 视口固定,由引擎定位 / 支持拖动 |
| z-index:6519 | 高于常规遮罩层,避免被普通卡片覆盖 |
| rgba(255,255,255,.8) | 半透明底 + box-shadow 0 0 2px 描边光 |
| .card-head i | 关闭钮(装饰示例用 ✕) |
注意: 属于引擎卡——引擎自动初始化
.card-popup 并绑定弹出逻辑;页面内放置会默认隐藏或随引擎弹出,详情页统一代码块演示。
KuoqiUI v2.00 · 离线静态文档 · 界面基于 KuoqiUI ·
返回首页