css - jQuery Mobile li 元素中右侧的图像

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 属性，使其与偏移父元素的右侧对齐。