如何移除换行？网页<p>标签间自动换行问题咨询

为什么会出现换行？ #

这是浏览器的默认渲染规则：<p>属于块级元素，浏览器会自动为块级元素添加上下外边距（margin）。哪怕你在代码里把两个<p>标签紧挨着写，页面渲染时它们之间也会因为默认外边距产生间距，看起来像是自动加了换行。这种情况是浏览器的标准行为，一直存在。

如何移除不必要的间距？ #

可以通过以下几种CSS方法解决：

• 全局重置p标签默认边距：直接覆盖浏览器默认样式，让所有p标签取消外边距：

  p {
    margin: 0;
  }
  

• 针对特定p标签调整：给需要消除间距的p标签添加自定义类，仅修改这类标签的样式：
  HTML代码：

  <p class="no-gap">a</p>
  <p class="no-gap">b</p>
  

  CSS代码：

  .no-gap {
    margin: 0;
  }
  

• 仅消除相邻p标签的间距：用相邻兄弟选择器，只去掉后一个p标签的上边距，保留第一个p的下边距（适合需要p与其他元素保留间距，但相邻p之间无间距的场景）：

  p + p {
    margin-top: 0;
  }
  

内容的提问来源于stack exchange，提问作者PancakeCoder