Question

我正在使用phonegap / cordova开发移动应用。我希望我的主菜单是一组带有短文本的图标，所有图标都以网格布局排列（例如2行×3列）。我也在使用jquerymobile。对于我的“页面”，我有一个固定的“标题”和“页脚”区域，目前“内容”：

<div class="ui-grid-b ui-responsive" >
   <div class="ui-block-a"><div class="ui-bar ui-bar-a">
      <a href="#"><p><img src="./img/menu1.png"></p><h2>OPT1</h2></a>
   </div></div>
   <div class="ui-block-b"><div class="ui-bar ui-bar-a">
      <a href="#"><p><img src="./img/menu2.png"></p><h2>OPT2</h2></a>
    </div></div>                    
    <div class="ui-block-c"><div class="ui-bar ui-bar-a">
      <a href="#"><p><img src="./img/menu3.png"></p><h2>OPT3</h2></a>
    </div></div>                    
    <div class="ui-block-a"><div class="ui-bar ui-bar-a">
      <a href="#"><p><img src="./img/menu4.png"></p><h2>OPT4</h2></a>
    </div></div>                    
    <div class="ui-block-b"><div class="ui-bar ui-bar-a">
      <a href="#"><p><img src="./img/menu5.png"></p><h2>OPT5</h2></a>
    </div></div>                    
    <div class="ui-block-c"><div class="ui-bar ui-bar-a">
      <a href="#"><p><img src="./img/menu6.png"></p><h2>OPT6</h2></a>
    </div></div>                    
</div>

我希望通过调整网格整体高度或调整行高来使网格的高度等于“内容”的高度。我不想定义固定高度，因为菜单应调整到不同的屏幕尺寸。（如果某些JS可以相应地改变它，那么高度可能是一个数字）

网上有一些方法，但我找不到任何自动调整高度的方法。示例：http://www.vjkhan.com/jquery-mobile-jqm-grid-with-images-and-captions/

解决方案可以是任何类型的...... CSS，JS等...

非常感谢任何建议！

干杯！

phonegap cordova菜单网格

0 个答案: