Question

我正在一个项目上，具有以下代码片段：

<h2 style="color: #818181;">Details</h2>
<p><i class="fa fa-envelope"></i> xxxxxxx@gmail.com<br>
<i class="fa fa-phone"></i> 12345678<br>
<i class="fa fa-map-marker"></i> 1 Yeet Street, Azerbaijan</p>

这给我留下了这个： Image

有什么方法可以减少标题和图标之间的换行符，而无需在它们的文本的新行上开始图标？

Answer 1

垂直空间是margins和h2元素的默认顶部/底部p的组合。您将需要添加样式以使用CSS样式表减少/删除margin，margin-top和/或margin-bottom：

h2 {
  margin: 0;
}

p {
 margin: 0;
}

或使用内联样式：

<h2 style="color: #818181; margin: 0">Details</h2>
<p style="margin-top: 0;"><i class="fa fa-envelope"></i> xxxxxxx@gmail.com<br>
<i class="fa fa-phone"></i> 12345678<br>
<i class="fa fa-map-marker"></i> 1 Yeet Street, Azerbaijan</p>

减少标题和图标之间的空间

1 个答案: