jquery - 如何在jquery mobile中的同一个div中给出两个图标？

Question

我想显示到没有像这样的文本的图标left arrow and right arrow

输出如下：

<  Saturday Sep 08 2012 >

我试过如下：

<div data-role=content data-theme="c" style="text-align:center"  >
        <a href="#" data-role="button" data-icon="arrow-l" data-iconpos="notext"></a> 
        <span><font size="1px" color="blue" >Saturday Sep 08 2012</font></span>
        <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="notext"></a> 
    </div>

Answer 1

你可以使用自己的Grid系统。

<div class="ui-grid-b">
  <div class="ui-block-a">Block A</div>
  <div class="ui-block-b">Block B</div>
  <div class="ui-block-c">Block C</div>
</div>

在你的例子中，你会有这样的事情：

<div class="ui-grid-b">
    <div class="ui-block-a"> 
        <a href="#" data-role="button" data-icon="arrow-l" data-iconpos="notext"></a>
    </div>
    <div class="ui-block-b">
        <span><font size="1px" color="blue" >Saturday Sep 08 2012</font></span>
    </div>
    <div class="ui-block-c">
        <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="notext"></a>
    </div>
</div>

---

根据您的评论，您需要做的就是使用自己的样式将元素对齐到正确的位置。

看到这个活的例子：http: //jsbin.com/imokaw/1/edit