css - 使用 CSS 将图像大小调整为当前文本高度

Question

上下文：我正在尝试将方程的内联图像（PNG 文件）无缝插入网页。我知道这已经完成了，但我将其用作学习项目。因此，我对显示数学的库不感兴趣，而是对这个问题的一般答案感兴趣。

我希望图像能够自然地缩放它们的高度，以匹配当前文本高度的某个百分比，并使用 css 样式。我是网页设计的新手，但似乎我应该能够包含一种看起来像这样的样式：

height: 80% * parent.text_height

纯CSS可以做到这一点吗？

Answer 1

Ems 是一个相对的度量单位，它取决于父元素的文本大小。1 em 大约是文本行之间的距离。因此，您可以尝试：

height: .8em;

但请注意，内联元素（如普通的旧img标签）不接受高度规范。