如何根据 div 大小按比例调整字体大小答案

【问题标题】：How to resize font-size proportionally to div size如何根据 div 大小按比例调整字体大小
【发布时间】：2012-01-28 04:22:58
【问题描述】：

我正在尝试创建一个网站，在该网站中，页面会动态调整为窗口大小。虽然我们可以让图像等自动调整为 div 大小的百分比。我们似乎无法将 div 中的文本调整为容器的相对百分比。

此功能需要在调整浏览器窗口本身大小时工作，而无需刷新页面。

该网站是基本的，使用 js、css、html。最简单的方法将不胜感激，但任何解决方案都很棒。

谢谢

【问题讨论】：

能否请您发布您的代码，以便我可以尝试让它为您工作？

标签： javascript css html text autoresize

【解决方案1】：

所以你可以使用 screen.availHeight 来计算一个常数值，你可以乘以字体大小。

window.onload = function () {
    document.body.style.fontSize = (Math.ceil(screen.availHeight * parseInt(document.body.style.fontSize) / 600) + 'px';
}

【讨论】：

【解决方案2】：

举了一些例子来调整 div 大小变化的字体大小。在父 div 中使用百分比并在那里调整字体大小应该可以解决问题。

http://jsfiddle.net/744A2/

【讨论】：

【解决方案3】：

如何使用媒体查询？

【讨论】：

【解决方案4】：

甚至使用 % 作为文本。 http://w3schools.com/cssref/css_units.asp

【讨论】：

不幸的是，这不起作用，因为使用 font-size 它将其设置为“将字体大小设置为父元素字体大小的百分比”。我需要它是父元素本身的 %。但我很欣赏这个建议。
如果您使用 %age 作为 div 宽度。然后它也会自动调整文本。