css - 列表li與li之間的間距怎么設置？

問題描述

如上圖所示，這個是使用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 邊框 之間的空隙？

問題解答

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

謝謝各位答主啊。。。

ps:鬧了半天是一個烏龍。。。真想找個地縫鉆進去。。。捂臉。。。。

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

這個也沒有問題啊

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

設置中間li的margin不行嗎

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

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