在这种情况下，如何计算 ems 中的“行高”？

Question

我知道行高是基本字体的倍数，即字体为 12px 的段落，行高为 2em 将使其变为 24px。

我有一些从 Word 复制并粘贴到我们应用程序中的在线富文本编辑器的标记。除了大量其他垃圾之外，我们还得到了以下场景。有时文本会在段落内粘贴一个跨度，有时只是跨度。每个标签可能有不同的字体大小。 （完全取决于字面意思，我们无法控制）。无论如何，行高必须相同。但是带有段落的示例具有不同的行高，因为<p> 标签的字体大小比跨度大。基本上看起来line-height 是使用段落中的字体大小计算的，但字体大小本身是来自您所期望的跨度。

我的第一个问题是......为什么行高使用段落的字体大小而不是跨度的？

我的第二个问题是，谁能想到使用 CSS 解决这个问题的方法？

显然你只会删除内联样式，但这个应用程序的用户不是开发人员，他们不了解 html。这个编辑器的目的是让用户在没有开发人员帮助的情况下创建这些在线文档。我很想在样式表中找到解决这个问题的方法。

span, p {
   line-height: 2em;
   font-size: 14px;
}

<p style='font-size: 16px;'><span style="font-size: 12px;">Candidates will be given a hypothetical psychological report in which relevant background information (i.e., country of origin, primary language spoken in the home, and length of time living in the U.S.) and assessment data will be detailed.Candidates should demonstrate an increasing understanding and knowledge of CLD concepts and issues within the reports. Based on information provided candidates are to complete the report incorporating the following:</span>
</p>
<span style="font-size: 12px;">Candidates will be given a hypothetical psychological report in which relevant background information (i.e., country of origin, primary language spoken in the home, and length of time living in the U.S.) and assessment data will be detailed.Candidates should demonstrate an increasing understanding and knowledge of CLD concepts and issues within the reports. Based on information provided candidates are to complete the report incorporating the following:</span>

Answer 1

发生这种情况是因为span 是内联的，因此其文本会受到周围行高的影响（p）。如果您将span 设置为display:inline-block，它将是相同的。

span, p {
   line-height: 2em;
   font-size: 14px;
}
p span{display:inline-block;}

<p style='font-size: 16px;'><span style="font-size: 12px;">Candidates will be given a hypothetical psychological report in which relevant background information (i.e., country of origin, primary language spoken in the home, and length of time living in the U.S.) and assessment data will be detailed.Candidates should demonstrate an increasing understanding and knowledge of CLD concepts and issues within the reports. Based on information provided candidates are to complete the report incorporating the following:</span>
</p>
<span style="font-size: 12px;">Candidates will be given a hypothetical psychological report in which relevant background information (i.e., country of origin, primary language spoken in the home, and length of time living in the U.S.) and assessment data will be detailed.Candidates should demonstrate an increasing understanding and knowledge of CLD concepts and issues within the reports. Based on information provided candidates are to complete the report incorporating the following:</span>