css - 列表li与li之间的间距怎么设置？

Question

如上图所示，这个是使用appcan开发的移动app, 图中的li是使用Listview列表组件写的，代码如下：

<p id="listview">  </p>

var updateData = [{
            title : "上海教育体系被赞世界最强之一教师是教育质 量的核心",
            note : "2016-01-01",
            icon : "img/icon_01.png"
        }, {
            title : "上海教育体系被赞世界最强之一教师是教育质 量的核心",
            note : "2016-01-01",
            icon : "img/icon_02.png"
        }];
        var lv1 = appcan.listview({
            selector : "#listview",
            type : "thickLine",
            hasIcon : true,
            hasAngle : false
        });
        lv1.set(updateData);

这个列表加了margin来设置li与li之间的间距，不起作用。

要达到如下图所示的效果，ul的background-color是灰色的，li的background-color是白色的，li是有边框的， 上个li的下边框与下个li的上边框 之间是有空隙的。

请问，如何用css设置这种 li与li 边框 之间的空隙？

Answer 1

找到問題的原因了，不是margin不起作用，而是background-color：#fff寫錯了，ul也成了白色背景
-_-||| @_@

謝謝各位答主啊。 。 。

ps:鬧了半天是個烏龍。 。 。真想找個地縫鑽進去。 。 。摀臉。 。 。 。

Answer 2

margin是外邊距 .這不就可以了嗎？

這也沒問題

看了樓下的。我再給你貼一個padding的

Answer 3

設定中間li的margin不行嗎

Answer 4

https://jsfiddle.net/n60rkeka/1/

Answer 5

設定margin就可以了。但看上面的答案你都沒採納，是不是你的需求沒搞清，到底要怎麼弄