问题标签 [line-height]

使用1.4 的值是否与使用140%的值line-height相同？line-height换句话说，我们可以认为无单位值与百分比值相同吗？

我不知道为什么“line-height”在 iframe 下失效，以前有人遇到过同样的问题吗？顺便说一句，有两个差异： 1. 我以某种方式使用 iframe：document.write不是src。有关系吗？2.div下有svg标签

这是一个完整的例子：

我们正在建立一个新网站并希望使用一些网络字体（托管在 fonts.google.com 上）。我们过去已经这样做了，并且没有遇到问题（当时使用 OpenSans）。这次我们选择了不同的字体（https://fonts.google.com/specimen/Josefin+Sans）。

但是当我使用该字体时，与使用系统字体或无衬线字体或基本上任何其他字体相比，文本似乎没有对齐。感觉字体在其文本框中是顶部对齐的。

通过将 div 的 line-height 设置为其高度，它应该在 div 内垂直居中。

我在想象事情吗？如果没有，有没有办法解决这个问题？通过一些 css-magic 或通过编辑字体（虽然我不知道如何做到这一点）。

我创建了一个codepen，通过从我们的网站复制相关样式来说明我的问题： https ://codepen.io/w00dy73/pen/mdewMNz

（Stackoverflow 告诉我将代码放在 codepen 链接旁边，但我不确定正确的代码是什么）

根据要求，这是我的屏幕截图（Mac 上的 Firefox）：

黑线代表 div 的垂直中心，将图标切成两半。在顶部 div 中，文本不是一半，它有点头重脚轻。在底部 div 中，文本完全居中。蓝色框是文本框的轮廓，虚线是 Firefox 在我检查元素时在开发控制台中显示的内容。顶部 div 的文本框与图像不对齐（与顶部有 1-2px 的轻微偏移），底部工作正常。

我想在 react-draft-wysiwyg 编辑器中实现行间距选项（单，双，精确，每英寸行），但目前我认为它不支持自定义行间距，打开问题，问题陈述是我想申请根据用户输入不同段落的不同行距我应该如何实现这个功能？

通过更改编辑器的行高，它将在整个编辑器上应用行高，但我想具体说明用户选择的段落

假设我有一个 <div> 元素，我想让它的宽度等于当前的行高。是否有一个 CSS 单元或一些花哨的 calc() 函数可以完成这个？我知道一种解决方法是将实际行高简单地硬编码到 calc() 函数中，但我想知道是否有一种方法可以处理所有行高。

到目前为止，我不喜欢使用硬编码的 line-height 值（本例中为 1.33）：

所以我遇到了一个奇怪的 CSS 行高问题，列表项可能会在单个点上包裹到第三个项目。行高有一个设定值，但是当它在同一点内换行到第三行时，行高是不同的。

到目前为止，我已将行高值和高度设置为自动。这没有任何区别。我想知道是否需要为此设置另一个我不知道但在网上找不到任何有用资源的属性。

当我尝试在文本旁边显示图标时，图像在上方添加了不需要的空间，增加了行高，我不明白如何控制它。我尝试了框架，填充，调整大小但没有成功。我还尝试了 XCode 无法识别的 Label 元素（“未解析的标识符标签”）。

该图像显示了图像和文本之间的差异，其中图像添加了不需要的空间。

额外的空间来自哪里，我该如何控制它？

我正在试验 line-height 属性，并从MDN中读到：

在不可替换的内联元素上，它指定用于计算行框高度的高度。

然而，在下面的例子中，我设置了 line-height ，.one但它也影响了所有其他 div 的高度。为什么会这样？

1. 在将line-height属性设置为之前.one：

2. 设置line-height属性后.one：

我有一个看起来像这样的 div：

我想减少行之间的字距。我尝试将 line-height 指令添加到包含的 div 和标签元素之一，如下所示：

……但这没什么区别。

我需要做什么才能垂直“皱起”线条？

更新

奇怪的是，当我查看源代码时，我添加到 div 样式（以及边距）的 line-height 被消除了：

我在写 CSS：

浏览器中的计算尺寸：block1 高度 = 19px 和 block2 高度 = 19.2px

差异从何而来？我如何使用 rem 获得相同的尺寸？