1

我正在使用 JQuery Mobile 创建一个包含页眉、内容和页脚区域的页面。整个内容区域必须分成两个部分，每个部分 50%，其中每个部分必须是一个按钮，没有任何圆角或间距，可以根据使用的设备和设备的布局（纵向或风景）。我尝试了几种方法，例如 withdata-role="controlgroup"和 withdata-type="horizontal"但它似乎没有提供我想要的。有人可以告诉我这是否可能，如果可以，应该使用哪些元素和属性？提前致谢！

4

1 回答 1

2

这是一个工作示例：http: //jsfiddle.net/Gajotres/TfzPw/

该解决方案需要：

  1. jQuery Mobile 网格（Omar 在他的评论中提到了它）

    <div class="ui-grid-a">
    <div class="ui-block-a"><a data-role="button" id="custom-btn">Button Left</a></div>
    <div class="ui-block-b"><a data-role="button" id="custom-btn">Button Right</a></div>
</div><!-- /grid-a -->

    官方文档：http: //jquerymobile.com/demos/1.3.0-rc.1/docs/content/content-grids.html

  2. 去除圆角：

    $(document).on('pagebeforeshow', '#index', function(){       
    $('a').buttonMarkup({ corners: false });
});

    官方文档：http: //jquerymobile.com/demos/1.3.0-rc.1/docs/buttons/buttons-options.html

  3. 删除内容 div 上的填充：

    #index-content {
    padding: 0 !important;
}

  4. 删除按钮边距：

    #custom-btn {
    margin: 0 !important;
}
于 2013-03-11T22:39:35.700 回答