标签:
声明方式(HBuilder会自动生成)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet"/>
<script type="text/javascript" charset="utf-8">
mui.init();
</script>
</head>
<body>
<p>内容区</p>
</body>
</html>
accordion 折叠面板
<body>
<ul class="mui-table-view">
<!--折叠面板的默认选中项 mui-active-->
<li class="mui-table-view-cell mui-collapse mui-active">
<!--折叠面板标题内容-->
<a class="mui-navigate-right" href="#">面板1</a>
<!--折叠面板具体内容-->
<div class="mui-collapse-content">
<p>面板1子内容</p>
</div>
</li>
<li class="mui-table-view-cell mui-collapse">
<a class="mui-navigate-right" href="#">面板2</a>
<div class="mui-collapse-content">
<p>面板2子内容</p>
</div>
</li>
<li class="mui-table-view-cell mui-collapse">
<a class="mui-navigate-right" href="#">面板3</a>
<div class="mui-collapse-content">
<p>面板3子内容</p>
</div>
</li>
</ul>
</body>
badges数字角标
<body>
<!--默认灰色背景-->
<span class="mui-badge">1</span>
<!--蓝色-->
<span class="mui-badge mui-badge-primary">12</span>
<!--绿色-->
<span class="mui-badge mui-badge-success">123</span>
<!--橘黄色-->
<span class="mui-badge mui-badge-warning">3</span>
<!--红色-->
<span class="mui-badge mui-badge-danger">45</span>
<!--紫色-->
<span class="mui-badge mui-badge-purple">456</span>
<!--无色-->
<span class="mui-badge mui-badge-inverted">1</span>
</body>
button按钮
<body>
<!--背景色按钮-->
<button type="button" class="mui-btn">默认</button>
<button type="button" class="mui-btn mui-btn-primary">蓝色</button>
<button type="button" class="mui-btn mui-btn-success">绿色</button>
<button type="button" class="mui-btn mui-btn-warning">黄色</button>
<button type="button" class="mui-btn mui-btn-danger">红色</button>
<button type="button" class="mui-btn mui-btn-royal">紫色</button>
<!--边框色按钮-->
<button type="button" class="mui-btn mui-btn-outlined">默认</button>
<button type="button" class="mui-btn mui-btn-primary mui-btn-outlined">蓝色</button>
<button type="button" class="mui-btn mui-btn-success mui-btn-outlined">绿色</button>
<button type="button" class="mui-btn mui-btn-warning mui-btn-outlined">黄色</button>
<button type="button" class="mui-btn mui-btn-danger mui-btn-outlined">红色</button>
<button type="button" class="mui-btn mui-btn-royal mui-btn-outlined">紫色</button>
</body>
HTML5 mui框架(声明方式)(折叠面板)(数字角标)(按钮)
标签:
原文地址:http://www.cnblogs.com/lovling/p/5700581.html