android - 如何为旧版 Android 浏览器的响应字体实现 vh 和 vw 字体大小单元？

Question

android 的旧版浏览器似乎不支持css 中的vh 和vw 字体大小单元。有什么方法可以使用 vw 和 vh 或任何其他方法来使字体在旧的 android 浏览器中响应？我有很多不同字体大小的文本，我不想使用媒体查询。

Answer 1

您可以使用 jquery 来做到这一点。有 3 个步骤可以使字体响应。

1. 将字体调整为固定值。例如 800px。
2. 在要制作字体的任何dom元素中使用类名响应式。例如 class="rf"(响应式字体)。
3. 使用下面的 jquery 代码使字体响应。

html代码..

<div class="rf">this is sample text</div>

jquery代码..

$(function(){

  var element = $('.rf');
    element.each(function (i) {
        fonts = $(this).css('font-size');
        fonts = fonts.replace("px","");
        windowWidth = $(window).width();
        fontSize = fonts*windowWidth/800;
        $(this).css('font-size',fontSize);
    });

})

根据您的类名“rf”和您用来调整字体大小的“800”更改代码。