当容器保持纵横比时，如何放大 css font-size？

问题描述

假设我有一个元素：

<div class="container">
  <div class="text">Hello</div>
</div>

.container {
  position: relative;
  width: 209px;
  height: 323px;
}

.container .text {
  position: absolute;
  top: 100px;
  left: 100px;
  font-size: 20px;
}

不使用任何类型的变量 font-size unit，如果 .container 元素按 {{1} 放大到 528px }}（所以它具有完全相同的纵横比），当父级放大时，倍增因子是多少，所以文本的大小相对相同？ 816px 和 top 很容易重新计算，但我不确定字体。我猜 left 可能会影响比例因子，对吗？

更新

就我而言，无论 font-family 是什么，这都是文本元素的高度。我看到另一篇 SO 帖子（忘记链接）详细介绍了确定文本元素高度的许多变量（font-size、font-size、line-height 等）并且某种组合将允许 vertical-align 和 font-size 相等。知道这一点后，缩放 height 就变得微不足道了。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）