删除两个文本元素 <p> 和 <h1> 之间的垂直间距答案

【问题标题】：Remove vertical space between two text elements <p> and <h1>删除两个文本元素 <p> 和 <h1> 之间的垂直间距
【发布时间】：2015-05-17 07:23:17
【问题描述】：

似乎找不到如何删除两个文本元素之间的垂直空间，这个网站上有一些类似的问题，但似乎并没有真正起作用。

HTML 代码：

<p>this website is</p> <h1>Encrypted</h1>

似乎我必须使用位置代码，但是当我使用让其他元素靠近它的位置代码时，文本会被推送到网站上的另一个位置

【问题讨论】：

标签： html css text

【解决方案1】：

使用 CSS 删除元素之间的空白：

水平存在（顶部和底部空间）

h1, p {
margin-top: 0;
margin-bottom: 0;
line-height: /* adjust to tweak wierd fonts */;
}

垂直存在（左右空间）

.parent {
font-size: 0;
line-height: 0;
}

h1, p {
font-size: 12px;
margin: 0;
display: inline-block;
}

【讨论】：

【解决方案2】：

每个浏览器都有预设的元素样式。 p 和标题标签设置了边距。您可以使用 margin: 0; 更改此设置：JS Fiddle

您也可以通过使用CSS Reset 来避免这些问题。

另外，我不认为代码中的“加密”一词应该使用<h1> 标签：How to properly use h1

【讨论】：