样式化列表视图以隐藏 jquery mobile 列表视图中项目之间的小间隙答案

【问题标题】：Styling the listview to hide the small gap between items in a listview in jquery mobile样式化列表视图以隐藏 jquery mobile 列表视图中项目之间的小间隙
【发布时间】：2012-08-15 06:53:26
【问题描述】：

我有一个列表视图，我想要做的是以这样一种方式设置列表视图，即我们不会在“框”（列表视图的默认方式）中看到列表中的每个项目。我有应用了一些 CSS，但每个列表项之间仍然存在小差距。请帮我解决这个问题。

这是我用过的css

    .list li{
                border-width:-5px !important;
                border-top-width:0px !important;
                background:#cccccc;
}

提前致谢。

这里有一个示例 - http://jsfiddle.net/Lvp9j/

【问题讨论】：

标签： jquery css jquery-mobile

【解决方案1】：

添加以下css代码（可以去掉border-width和border-top-width规则）：

.ui-li {
    border-top: 0;
}

另见我的jsfiddle。

【讨论】：

【解决方案2】：

如果您在列表中使用边框，则设置 border-top: 0 不是一个很好的选择。相反，您可以像这样设置项目之间的空间：

.ui-li {
    margin-bottom: -1px !important;
}

【讨论】：