自动缩放图像以匹配文本高度
Posted
技术标签:
【中文标题】自动缩放图像以匹配文本高度【英文标题】：Automatically scale an image to match text height 【发布时间】：2012-08-30 10:03:29 【问题描述】：我有一个图像，我想将它与一些文本内联使用，但我需要它来匹配文本高度。我知道有可能像<img src="img.jpg" height=16> 甚至<img src="img.jpg" height="100%"> 这样的东西，但前者不随文本大小缩放，而后者似乎使它成为 div 的大小，而不是文本高度。有人可以帮忙吗？
示例 html：
<body>
This is a test <img src="img.jpg">
</body>
【问题讨论】：
你愿意使用javascript/jQuery吗？ CSS 无法为您做到这一点。您需要使用 JavaScript。 :D 我想这就是为什么这个问题被标记为 JavaScript 我可以使用javascript，我不知道是否需要。 尝试用span 或其他东西包裹文本，然后用它的 (jquery) 获取 $('span').outerHeight(true) 并做这个伎俩。
【参考方案1】：
您是否尝试过将图像高度设为 1em？
img height: 1em;
在这里查看小提琴：http://jsfiddle.net/yAr7z/
【讨论】：
效果很好，虽然我需要使用 0.8em。谢谢！1ex 或类似的字体应该更好地适应各种字体 - 它会匹配小写文本的 height。
谢谢@BeniCherniavsky-Paskin。
效果很好，谢谢！这是内联标签：以上是关于自动缩放图像以匹配文本高度的主要内容，如果未能解决你的问题，请参考以下文章