Layui之徽章和面板的使用
Posted 时光-ing
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Layui之徽章和面板的使用相关的知识，希望对你有一定的参考价值。
样品图展示：
部分源码展示：
<div class="layui-col-md6" >
<!--数据处理-->
<div class="layui-row layui-col-space15" >
<div class="layui-bg-white">
<div class="layui-row layui-col-space30">
<div class="layui-col-md12">
<!--已审核数据-->
<div class="layui-card">
<div class="layui-card-header" style="color: #009688; font-size: 20px;font-weight: 700;">已审核数据</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space22">
<div class="layui-col-md2">
<div class="grid-demo grid-demo-bg1">
<span class="layui-badge layui-bg-green" style="font-size:18px;width: 16%;height:20px;">20</span>
<cite style="text-align: center;">数据</cite>
</div>
</div>
<div class="layui-col-md2">
<div class="grid-demo">
<span class="layui-badge layui-bg-green" style="font-size:18px;width: 16%;height:20px;">20</span>
<cite style="text-align: center;">数据</cite>
</div>
</div>
</div>
</div>
</div>
<!--待审核数据-->
<div class="layui-card">
<div class="layui-card-header" style="color: #FFB800; font-size: 20px;font-weight: 700;">待审核数据</div>
<div class="layui-card-body">
<div class="layui-row layui-col-space22">
<div class="layui-col-md2">
<div class="grid-demo grid-demo-bg1">
<span class="layui-badge" style="font-size:18px;width: 16%;height:20px;">10</span>
<cite style="text-align: center;">数据</cite>
</div>
</div>
<div class="layui-row layui-col-space22">
<div class="layui-col-md2">
<div class="grid-demo grid-demo-bg1">
<span class="layui-badge" style="font-size:18px;width: 16%;height:20px;">10</span>
<cite style="text-align: center;">数据</cite>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
以上是关于Layui之徽章和面板的使用的主要内容，如果未能解决你的问题，请参考以下文章