巧妙让两个span元素中间的空格不再有间隙

本文介绍了初学者在HTML和CSS中遇到的span元素间存在空格间隙的问题。这个问题实际上是由代码换行导致的。文章提出了三种解决方案:1. 将span元素写在同一行;2. 设置父元素的`font-size:0`,然后为span元素单独设置`font-size`; 3. 使用浮动方法。最后提到,不同方法在代码规范和浏览器兼容性方面有不同的考量。
摘要由CSDN通过智能技术生成

初学html、css的同学是不是遇到过这样一个问题?一对好朋友(两个span元素)之间总是存在间隙。就像下图那样:

巧妙让两个span元素中间的空格不再有间隙

 

这是一对不快乐的 span,因为他们中间有了间隙

当我们给span元素添加了内容时,两个相邻的span元素的文字之间有一个间隙

问:那么这个间隙到底是什么呢?

其实它是一个空格。

问:那这个空格怎么来的呢?

首先先来看看我们平时的代码书写习惯吧

巧妙让两个span元素中间的空格不再有间隙

 

我们是优秀的程序猿,代码要求格式要规范,所以我第二个span换行了

而就是这个没毛病的换行,让两个span差生了间隙。

巧妙让两个span元素中间的空格不再有间隙

 

让我们来看看怎么解决吧

聪明的你灵机一动,将代码写一行撒

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值