Question

默认情况下，如果将图像放在jquery Mobile中的li元素中，则图像将对齐到左侧。我想让它与右边对齐，就像这个

Here is some text  | Image

班级ui-li-thumb将图像对齐到左侧。我不能用我自己的一个覆盖这个类。有什么建议吗？

Answer 1

在CSS中，您可以指定比jQuery Mobile选择器更具体的选择器，也可以使用!important强制使用CSS规则：

.ui-page .ui-content .ui-listview .ui-li-thumb {
    left  : auto;
    right : 1px;
}

演示：http://jsfiddle.net/BHBJ8/1/

或

.ui-li-thumb { left : auto !important; right : 1px; }

演示：http://jsfiddle.net/BHBJ8/

请注意，由于.ui-li-thumb类绝对定位左侧锚定的元素，因此我们可以将left设置为auto并为元素提供right属性以对齐它位于偏移父母的右侧。

Answer 2

 <fieldset class="ui-grid-a">
    <div align="left" class="ui-block-a">
        <h5>18-inch,Split 5-spoke Bright Aluminium-alloy Wheels</h5>
        <img src="images/182x116-13TDI_GSSpecs035.jpg">
    </div>
    <div align="left" class="ui-block-b">
        <h5 >* A distinguished and elegant set of 18-inch,split5-spoke</h5>
    </div>
</fieldset>

这就是网页的外观

18英寸，分体式5辐明亮铝合金轮

Img |文字

jQuery Mobile li元素右侧的图像

2 个答案: