kero
Version:
114 lines (112 loc) • 5.39 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Title</title>
<link rel="stylesheet" type="text/css" href="http://design.yyuap.com/static/uui/latest/css/font-awesome.css">
<link rel="stylesheet" type="text/css" href="http://design.yyuap.com/static/uui/latest/css/tree.css">
<link rel="stylesheet" type="text/css" href="http://design.yyuap.com/static/uui/latest/css/grid.css">
<link rel="stylesheet" type="text/css" href="http://design.yyuap.com/static/uui/latest/css/u.css">
<link rel="stylesheet" type="text/css" href="http://design.yyuap.com/static/uui/latest/css/u-extend.css">
<link rel="stylesheet" type="text/css" href="widget.css">
</head>
<body>
<div class="u-container-fluid u-widget-bg">
<div class="u-row">
<div class="u-col-md-12">
<div class="u-widget u-widget-right">
<div class="u-widget-heading">
<h3 class="u-widget-title">基础按钮</h3>
</div>
<div class="u-widget-body">
<button class="u-button raised">BUTTON</button>
<button class="u-button raised accent">BUTTON</button>
<button class="u-button raised primary">BUTTON</button>
</div>
</div>
</div>
<div class="u-col-md-12">
<div class="u-widget u-widget-right">
<div class="u-widget-heading">
<h3 class="u-widget-title">圆形按钮</h3>
</div>
<div class="u-widget-body">
<button class="u-button floating">
<i class="fa fa-plus"></i>
</button>
<button class="u-button floating accent">
<i class="fa fa-plus"></i>
</button>
<button class="u-button floating primary">
<i class="fa fa-plus"></i>
</button>
</div>
</div>
</div>
<div class="u-col-md-12">
<div class="u-widget u-widget-right">
<div class="u-widget-heading">
<h3 class="u-widget-title">文字按钮</h3>
</div>
<div class="u-widget-body">
<button class="u-button">BUTTON</button>
<button class="u-button accent">BUTTON</button>
<button class="u-button primary">BUTTON</button>
</div>
</div>
</div>
<div class="u-col-md-12">
<div class="u-widget u-widget-right">
<div class="u-widget-heading">
<h3 class="u-widget-title">菜单按钮</h3>
</div>
<div class="u-widget-body">
<div class="u-menu-wrap">
<button class="u-button raised u-menu-button" id="demo-menu-lower-right1">
联查
<span class="u-right-icon uf uf-anglearrowdown"></span>
</button>
<ul class="u-menu u-menu-bottom-right" for="demo-menu-lower-right1">
<li class="u-menu-item "><a>报价单</a></li>
<li class="u-menu-item"><a>到货单</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="u-col-md-12">
<div class="u-widget u-widget-right">
<div class="u-widget-heading">
<h3 class="u-widget-title">分割按钮</h3>
</div>
<div class="u-widget-body">
<div class="u-button-group u-split">
<button class="u-button u-split-pre">
打印
</button>
<div class="u-button-group u-split-sub">
<button class="u-button u-dropdown-toggle" id="split">
<span class=" uf uf-anglearrowdown "></span>
</button>
<ul class="u-menu u-menu-bottom-right" for="split">
<li class="u-menu-item"><a>报价单</a></li>
<li class="u-menu-item"><a>到货单</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="http://design.yyuap.com/static/jquery/jquery-1.9.1.min.js"></script>
<script src="http://design.yyuap.com/static/knockout/knockout-3.2.0.debug.js"></script>
<script src="http://design.yyuap.com/static/uui/latest/js/u-polyfill.js"></script>
<script src="http://design.yyuap.com/static/uui/latest/js/u.js"></script>
<script src="http://design.yyuap.com/static/uui/latest/js/u-tree.js"></script>
<script src="http://design.yyuap.com/static/uui/latest/js/u-grid.js"></script>
<script src="http://design.yyuap.com/static/requirejs/require.debug.js"></script>
<script src="widget.js"></script>
</body>
</html>