的 DEMO

Question

简单地说，我想在设备不足以支持它们时隐藏JQM列表视图中的缩略图。我在技术上可以做到这一点，但空间没有被重复使用（这是隐藏它们的重点）。

我的CSS：

@media all and (max-width: 30em) {
    .list-breakpoint img { display: none; }
}

列表中的一个元素：

<li class="list-breakpoint" data-theme='a'>
    <a href="#">
        <img src="..." class="ui-li-thumb">
        <p><b>Title</b><br/>
           Line 1<br/>
           Line 2</p>
    </a>
</li>

Answer 1

LI中的锚标签按钮左侧有额外的填充以为图像腾出空间，因此隐藏图像，调整填充：

@media all and (max-width: 30em) {
    .list-breakpoint img { display: none; }
    .list-breakpoint a.ui-btn { padding-left: 1em !important; }
}

listview中的jQuery Mobile响应式缩略图

1 个答案:

的 DEMO