1.列表
列表是常用的UI控件,mui封装的列表组件比较简单,只需要在ul
节点上添加.mui-table-view
类、在li
节点上添加.mui-table-view-cell
类。
点击列表,对应列表项显示灰色高亮,若想自定义高亮颜色,只需要重写.mui-table-view-cell.mui-active
若右侧需要增加导航箭头,变成导航链接,则只需在li
节点下增加a
子节点,并为该a
节点增加.mui-navigate-right
类
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.css" rel="stylesheet" />
</head>
<body>
<div class="mui-content">
<h4>右侧无导航箭头</h4>
<ul class="mui-table-view">
<li class="mui-table-view-cell">Item1</li>
<li class="mui-table-view-cell">Item2</li>
<li class="mui-table-view-cell">Item3</li>
</ul>
<h4>右侧有导航箭头</h4>
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item1
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item2
</a>
</li>
<li class="mui-table-view-cell">
<a class="mui-navigate-right">
Item3
</a>
</li>
</ul>
<h4>圆角列表</h4&g