html - 为什么 元素的高度大于行高

Question

我遇到了一个奇怪的问题，或者我不知道怎么办 <br/>有效或者我在这里遗漏了一些东西。我的段落的行高为 24px。我想在文本之间有一个换行符(空行)，但是当我使用 <br/> 时根据 paint.net 的标记，它会创建一个空行(36 像素)，所以我做错了什么？

换行符的高度不应该与 line-height 属性相同吗？如果是，那为什么不起作用？如果不起作用，那么解决方案是什么？

<p>
   Greenfields Counselling and Psychotherapy is a counselling practice that lives and works out of the principles for counselling and psychotherapy as set down by Carl Rogers.
  <br/>
  <br/>
  Counselling at Greenfields is strictly confidential and we understand that this can be a difficult time for you.
</p>

这是CSS:

p {
  line-height: 24px;
}

这是演示:http://contestlancer.com/greenFields/?page_id=41查看单词 happen 之后的空格。

艾玛。

Answer 1

对我来说似乎完全没问题...如果你去掉其中一个 <br> s 我测量了“facilitate”的 f 和“Counseling”的 C 之间的距离为 13px .如果我再把它放回去，它就是37px .

37px - 13px = 24px = the line-height you set = everything is okay ;)

(通过 Greenshot 进行测量；))

所以如果你对自己的<br>的高度不满意你应该为你的 css 添加一个特殊条件:

br
{
    line-height: <desired_value>;
}

PS:所以为了进一步澄清，line-height与两行中两个字母之间的空格不同...