调整窗口大小时自动调整文本大小（字体大小）？

一尘不染

调整窗口大小时自动调整文本大小（字体大小）？

css

我一直试图（徒劳地）建立一个页面，当我更改窗口大小时，其元素将重新调整大小。我可以在CSS中使用它来处理图像，但是没有问题，但是我似乎无法在文本上完成相同的操作，而且我不确定在CSS中是否有可能。而且我似乎找不到能完成此任务的jQuery脚本。

当用户调整窗口大小时，我实质上希望页面能够动态流畅地缩放，而无需用户调用页面缩放。通过css在我的img
div上这可以正常工作，但对于文本则不起作用，它保持相同的大小。

有任何想法吗？

阅读 544

2020-05-16

共1个答案

一尘不染

我必须自己做。我所做的是我为正文设置了基本文本大小，并为所有其他大小设置了百分比。然后，我使用一个简单的jQuery脚本来更改窗口调整大小的基本大小。然后其他大小也会更新。

我用了这样的东西：

$(function() {
    $(window).bind('resize', function()
    {
        resizeMe();
        }).trigger('resize');
    });

在resizeMe函数中，我有：

//Standard height, for which the body font size is correct
var preferredHeight = 768;
//Base font size for the page
var fontsize = 18;

var displayHeight = $(window).height();
var percentage = displayHeight / preferredHeight;
var newFontSize = Math.floor(fontsize * percentage) - 1;
$("body").css("font-size", newFontSize);

2020-05-16