html - 元素之间的 jquery 移动 ListView 空间/如何删除 ListView 边框

Question

我想在 jquery mobile 中的 ListView 的列表项之间放置一个空格。为此，我为每个列表项都留了一个边距。到目前为止，这工作正常，但 ListView 的左侧和右侧有一个边框，特别是在间隙中可以看到。例如我有这个 jsfiddle:http://jsfiddle.net/2BhAd/3/ . 我试图通过将 ListView 的边框设置为无来解决问题，但这不起作用。 CSS:

.listitem {
   margin-top: 10px !important;
}
#list {
   border:none !important;
}

HTML:

<ul id="list" data-role="listview" data-theme="b" data-inset="true">
   <li class="listitem"><a href="#">
        <img src="http://placehold.it/100x100">
        <h2>Broken Bells</h2>
        <p>Broken Bells</p></a>
    </li>
    <!-- ... -->
</ul>

Answer 1

尝试

.listitem {
    margin-top: 10px !important;
}
#list{
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
}
#list .ui-li {
    border: none;
}

这会从列表和单个元素中删除边框。它还消除了列表上的阴影效果。

Updated FIDDLE