span标签间有空格
来源：3-4 文字logo
小白0719
2022-11-21 11:42:14
老师，为什么上面一种写法网页显示会有空格，但是课程中也是按照上面写法是没有空格的？
<p id="p1"> <span class="blue">F</span> <span class="red1">a</span> <span class="orange">c</span> <span class="green">e</span> <span class="blue">B</span> <span class="red1">o</span> <span class="orange">w</span> <span class="green">l</span> <br> <span class="blue">F</span><span class="red1">a</span><span class="orange">c</span><span class="green">e</span><span class="blue">B</span><span class="red1">o</span><span class="orange">w</span><span class="green">l</span> </p>
写回答
1回答
-
好帮手慕小尤
2022-11-21
同学你好，1、产生空格的原因：元素被当成行内元素排版的时候，元素之间的空白符（空格、回车换行等）都会被浏览器转换成一个空白字符，所以第一种方法出现空格。
2、解决的方法，可以像同学这样将span标签书写在一行，同学也可以先为父元素设置字体大小为0px，然后span 子元素再设置字体大小。如下所示：
#p1{ font-size: 0px; } #p1 span{ font-size: 16px; }祝学习愉快！
0
