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 system。

<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

如何在jquery mobile中的同一div中提供两个图标？

1 个答案: