首页 > 问答 > 正文
1
2
3
4
5
<code class="html"><p id="app">
<code
class
=
"html"
><p id=
"app"
>
<span v-for="item in items">{{ item }}</span>
<span v-
for
"item in items"
>{{ item }}</span>
<span>ttt</span>
<span>sss</span>
</p></code>
6
<code class="js">new Vue({
"js"
new
Vue({
el: '#app',
el:
'#app'
,
data: {
items: ['aaa', 'bbb', 'ccc']
items: [
'aaa'
'bbb'
'ccc'
]
},
})</code>
显示的效果大概是这样的:
aaabbbccc ttt sss
前面循环出的span没有间距,而后面的span有间距,不知道为什么。
阿神2017-05-19 10:26:38
如果有display:inline或是display:inline-block的元素相邻,并且它们之间有换行,那么就会自动产生一段间隙。可以在这些元素的父元素上设置font-size:0;,就可以消除换行带来的间隙。
ps:这种情况下,如果代码不换行,就不会产生间隙。
为情所困2017-05-19 10:26:38
你是不是强制回车换行的,这样的话会有个间距的
黄舟2017-05-19 10:26:38
行内元素的换行会占位的, 解决办法就是在你的#app中设置font-size:0; 这样换行符大小就变成了0, 就不会出现你说的间距了.