js设置移动端字体大小适配所有设备

最新推荐文章于 2024-05-06 19:42:56 发布

qq_32431191

最新推荐文章于 2024-05-06 19:42:56 发布

阅读量1.7k

点赞数

本文链接：https://blog.csdn.net/qq_32431191/article/details/83584195

版权

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <title></title>
    <style>
        html{
            font-size: 100px;
        }
    </style>
    <script>
        //自执行函数获取字体大小
        ~function () {
            let computed= function () {
                let desW=640;//设计稿宽度
                let devW=document.documentElement.clientWidth;//当前设备的宽度
                console.log(devW);
                if(devW>=640){
                    document.documentElement.style.fontSize="100px";
                    return false;
                }else{
                    document.documentElement.style.fontSize=devW/desW*100+"px";
                }
            }
            computed();
            window.addEventListener("resize",computed,false)
        }();
    </script>

</head>
<body>

</body>
</html>