@tower1229/flow-ui
Version:
Highly customizable UI framework based Seajs/jQuery
95 lines (94 loc) • 4.92 kB
HTML
<div class="p">
<div class="row">
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">按钮</div>
</div>
<div class="card-body">
<a href="###" class="btn btn-default">普通</a>
<a href="###" class="btn btn-primary">主色</a>
<a href="###" class="btn btn-auxiliary">辅色</a>
<a href="###" class="btn btn-success">成功</a>
<a href="###" class="btn btn-info">信息</a>
<a href="###" class="btn btn-warning">警告</a>
<a href="###" class="btn btn-danger">危险</a>
<a href="###" class="btn btn-link">链接</a>
</div>
</div>
</div>
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">按钮</div>
</div>
<div class="card-body">
<a href="###" class="btn btn-ghost btn-default">普通</a>
<a href="###" class="btn btn-ghost btn-primary">主色</a>
<a href="###" class="btn btn-ghost btn-auxiliary">辅色</a>
<a href="###" class="btn btn-ghost btn-success">成功</a>
<a href="###" class="btn btn-ghost btn-info">信息</a>
<a href="###" class="btn btn-ghost btn-warning">警告</a>
<a href="###" class="btn btn-ghost btn-danger">危险</a>
<a href="###" class="btn btn-ghost btn-link">链接</a>
</div>
</div>
</div>
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">按钮</div>
</div>
<div class="card-body">
<a href="###" class="btn btn-default"><i class="ion"></i> 普通</a>
<a href="###" class="btn btn-primary"><i class="ion"></i> 主色</a>
<a href="###" class="btn btn-auxiliary"><i class="ion"></i> 辅色</a>
<a href="###" class="btn btn-success"><i class="ion"></i> 成功</a>
<a href="###" class="btn btn-info"><i class="ion"></i> 信息</a>
<a href="###" class="btn btn-warning"><i class="ion"></i> 警告</a>
<a href="###" class="btn btn-danger"><i class="ion"></i> 危险</a>
<a href="###" class="btn btn-link"><i class="ion"></i> 链接</a>
</div>
</div>
</div>
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">按钮</div>
</div>
<div class="card-body">
<a href="###" class="btn btn-ghost btn-default"><i class="ion"></i> 普通</a>
<a href="###" class="btn btn-ghost btn-primary"><i class="ion"></i> 主色</a>
<a href="###" class="btn btn-ghost btn-auxiliary"><i class="ion"></i> 辅色</a>
<a href="###" class="btn btn-ghost btn-success"><i class="ion"></i> 成功</a>
<a href="###" class="btn btn-ghost btn-info"><i class="ion"></i> 信息</a>
<a href="###" class="btn btn-ghost btn-warning"><i class="ion"></i> 警告</a>
<a href="###" class="btn btn-ghost btn-danger"><i class="ion"></i> 危险</a>
<a href="###" class="btn btn-ghost btn-link"><i class="ion"></i> 链接</a>
</div>
</div>
</div>
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">按钮</div>
</div>
<div class="card-body">
<a href="###" class="btn btn-block btn-primary">块级按钮</a>
</div>
</div>
</div>
<div class="span-6 m-b">
<div class="card card-bordered">
<div class="card-head">
<div class="card-title">按钮</div>
</div>
<div class="card-body">
<a href="###" class="btn btn-lg btn-primary">大</a>
<a href="###" class="btn btn-primary">中</a>
<a href="###" class="btn btn-sm btn-primary">小</a>
</div>
</div>
</div>
</div>
</div>