Question

我想在jQuery mobile的标题右侧添加一个图标按钮。我在自动左定位方面遇到了麻烦。

这是我的标题：

<div data-role="header" data-position="inline">
     <h1>Resultaten</h1>
     <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext">home</a>
</div>

Answer 1

使用class="ui-btn-right"或在ui-btn-right

中添加课程<a>

<div data-role="header" data-position="inline">
     <h1>Resultaten</h1>
     <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext"  class="ui-btn-right">home</a>
</div>

Answer 2

如果您想要使用class="ui-btn-right"中的<a>向右对齐多个按钮，则会将所有按钮放在彼此的顶部。相反，你可以在它周围包裹一个div并浮动到右边。

<div data-role="header" data-position="inline">
    <h1>Resultaten</h1>
    <div style="float:right;">
        <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext"  class="ui-btn-right">btn 1</a>
        <a href="#Home" data-role="button" data-icon="home" data-iconshadow="false"
        data-direction="reverse" onclick="empty()" data-transition="slide"
        data-iconpos="notext"  class="ui-btn-right">btn 2</a>
    </div>
</div>

Answer 3

jQuery Mobile ver 1.2+中有一个数据属性，您可以使用data-iconpos="right"。

<a href="#Home" data-role="button" data-icon="home" data-iconpos="right" data-iconshadow="false"
    data-direction="reverse" onclick="empty()" data-transition="slide"
    data-iconpos="notext">home</a>

Official Documentation

在标题的右侧添加按钮

3 个答案: