2

私はJQuery Mobileアプリに取り組んでいます。このアプリには、「コンテンツ」セクションの下部に配置したい「コンテンツ」部分にボタンがあります。私のhtmlは次のようになります：

<div id="myPage" data-role="page">
    <div data-role="header" data-position="fixed">
        <a href="/page1" data-icon="arrow-l" data-iconpos="notext" class="ui-btn-left jqm-home">Back</a>
        <h1>My App</h1>
        <a href="/page3" class="ui-btn-right" data-role="button" rel="external" data-transition="slide">Next</a>
    </div>

    <div data-role="content">
        <ul data-role="listview"> 
            <li data-role="list-divider">
              Step 2 of 3
            </li>            
        </ul><br /><br />

        <!-- Main content Goes Here -->
        <br />

        <!-- I want the following button to be vertically aligned to the bottom so that it sits on top of the footer content -->
        <input type="button" value="View Table" onclick="return viewTable();" data-mini="true" />

    </div>

    <div data-role="footer" class="ui-bar" data-position="fixed"> 
      <!-- My Footer Content -->
    </div>
</div>

そのボタンをフッターのすぐ上に配置するにはどうすればよいですか? フッター自体に配置すると、使用されている色のために正しく見えません。

4

1 に答える 1

2

私の頭の上からこれを行う1つの方法は、IDを使用してボタンをdivでラップし、絶対に下に配置するCSSを追加することです。例：

html

<div id="viewTableBtn">
    <input type="button" value="View Table" onclick="return viewTable();" data-mini="true" />
</div>

CSS

#viewTableBtn{
    position:absolute;
    bottom:15px;
    width:94%;
}​
于 2012-05-19T21:40:57.370 に答える