h5移动端自适应js

<!DOCTYPE html>
<html lang="cn">
    <head>
        <meta charset="utf-8" />
        <meta id="viewport" name="viewport" content="width=device-width,height=device-height,user-scalable=no, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0">
        <title>h5自适应</title>
        <script>
            var bw = (document.documentElement.clientWidth / 7.5) + "px";
            var htmlTag = document.getElementsByTagName("html")[0];
            htmlTag.style.fontSize = bw;
        </script>
        <style>
            *{margin: 0;padding: 0;}
            h1{
                text-align: center;
                width: 7.5rem;
                font-size: .36rem;
            }
        </style>
    </head>
    <body>
        <h1>经过计算可得:750px == 7.5rem</h1>
    </body>
</html>

在这里插入图片描述

发布了97 篇原创文章 · 获赞 152 · 访问量 6521

猜你喜欢

转载自blog.csdn.net/qq_40745143/article/details/104836409