jQuery Mobile 导航栏左右角的图标对齐

Question

我正在使用以下代码将导航栏添加到我的移动网站。在这里，导航栏左侧有两个图标。但我想将下一个图标放置在右侧，这样两个图标将位于左侧和右侧的角上。

<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
  

    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>


 




    <div data-role="page">      

   
        <div data-role="footer" data-position="fixed" data-tap-toggle="false" data-theme="a">
            <div data-role="navbar" data-iconpos="left">
                <ul>
                    <li><a href="#one" data-icon="arrow-l" >Previous</a></li>
                    <li><a href="#two" data-icon="arrow-r" >Next</a></li>
                   
                </ul>
            </div><!-- /navbar -->                             
        </div> 

    </div>

这里是图片，我要输出

由于某些原因，代码无法正常工作，所以这里是我的演示代码段的 link Demo Snippets

Answer 1

你必须为此添加一些css

.ui-block-b a .ui-btn-inner .ui-icon{
  left: auto;
  right: 5px;
}

Updated Codepen

jQuery Mobile 导航栏左右角的图标对齐

Align icons at left and Right corner of navbar of jQuery Mobile

html

javascript

css

jquery

jquery-mobile