网格
jQuery Mobile 提供了一套基于CSS的分列布局。可以通过对class属性设置进行对网格布局。要使用网格需要添加class='ui-grid-solo|a|b|c|d',其中solo|a|b|c|d分别对应了以下的列数:ui-block-a(一列)、ui-block-a|b(两列)、ui-block-a|b|c(三列)、ui-block-a|b|c|d(四列)、ui-block-a|b|c|d|e(五列)。即class 为 ui-grid-b(三列布局),则必须添加 ui-block-a、ui-block-b 和 ui-block-c 的三个子元素。
如下代码是一个三列布局。
<p>三列布局:</p>
<div class="ui-grid-b">
<div class="ui-block-a" style="border:1px solid black;"><span>一些文本</span></div>
<div class="ui-block-b" style="border:1px solid black;"><span>一些文本</span></div>
<div class="ui-block-c" style="border:1px solid black;"><span>一些文本</span></div>
</div>
练一练两列布局。