kero
Version:
56 lines (53 loc) • 2.08 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-tabs">
<div class="u-tabs__tab-bar">
<a href="#tab-panel-1" class="u-tabs__tab is-active">页签1</a>
<a href="#tab-panel-2" class="u-tabs__tab">页签2</a>
<a href="#tab-panel-3" class="u-tabs__tab">页签3</a>
</div>
<div class="u-tabs__panel is-active" id="tab-panel-1">
<ul>
<li>项目1</li>
<li>项目2</li>
<li>项目3</li>
<li>项目4</li>
<li>项目5</li>
</ul>
</div>
<div class="u-tabs__panel" id="tab-panel-2">
<ul>
<li>项目1</li>
<li>项目2</li>
<li>项目3</li>
</ul>
</div>
<div class="u-tabs__panel" id="tab-panel-3">
<ul>
<li>项目1</li>
<li>项目2</li>
</ul>
</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>