css行内式写法（CSS之行内元素排列之间的缝隙问题及解决方案）
导读：运行结果如图所示：...
运行结果如图所示：
在代码中 ，我们用*去除了margin和padding ，还是能够看到span元素之间有一个空格 ，A和B并没有紧挨在一起
原因：这是因为我们书写代码的时候 ，在两个span标签之间输入了换行符（回车键）
怎么解决呢？
解决方案如下：
方案一：书写不换行
<div id="wrap">
<span>A</span> <span>B</span>
</div>
缺点：可阅读性大打折扣
方案二：给父标签设置一个属性：font-size：0
<style>
#wrap {
font-size: 0;
}
</style>
缺点：除此以外 ，还需要给每一个子节点设置字体大小
方案三：利用float解决
<style>
span {
float: left;
}
</style>
缺点：css的布局有可能会因此而改变 ，需要重新布局
方案四：给父节点设置属性 word-spacing: -4px;
<style>
#wrap {
word-spacing: -4px;
}
</style>
缺点：根据字体的大小 ，word-spacing 的值应该相应的调整 ，可能存在兼容性问题
方案五：给父节点设置margin-left: -4px;
<style>
#wrap {
word-spacing: -4px;
}
</style>
缺点：相比于方案四 ，这种兼容性较好一点
声明：本站所有文章 ，如无特殊说明或标注 ，均为本站原创发布 。任何个人或组织 ，在未征得本站同意时 ，禁止复制 、盗用 、采集 、发布本站内容到任何网站 、书籍等各类媒体平台 。如若本站内容侵犯了原著者的合法权益 ，可联系我们进行处理 。
创心域SEO版权声明：以上内容作者已申请原创保护，未经允许不得转载，侵权必究！授权事宜、对本内容有异议或投诉，敬请联系网站管理员，我们将尽快回复您，谢谢合作！