自动缩放图像以匹配文本高度

rlb*_*ond 15 html javascript css image

我有一个图像,我想与一些文本内联使用,但我需要它来匹配文本高度.我知道它可能是类似的<img src="img.jpg" height=16>甚至是偶数<img src="img.jpg" height="100%">,但前者不会随着文本大小而缩放,而后者似乎使它成为div的大小,而不是文本高度.有人可以帮忙吗?

示例HTML:

<body>
This is a test <img src="img.jpg">
</body>
Run Code Online (Sandbox Code Playgroud)

Pra*_*man 36

您是否尝试过将图像高度设为1em?

img {height: 1em;}
Run Code Online (Sandbox Code Playgroud)

看看这里的小提琴:http://jsfiddle.net/yAr7z/

  • `1ex`或类似的应该在字体之间工作得更好 - 它将匹配小写文本的*height*. (6认同)
  • 效果很好,虽然我需要使用 0.8em。谢谢! (3认同)
  • 效果很好,谢谢!这是内联标签:&lt;img [...] style="height:1ex;" /&gt; (3认同)