网页自动压缩宽高比例,动态响应html

<script type="text/javascript">
        
        //自调用函数
         (function () {
            // 1、页面一加载就要知道页面宽度计算
            var setFont = function () {
                //获取body
                let body = document.body;
                //计算比例宽度
                let widthRatio =body.offsetWidth / (1920);
                //计算比例高度
                let heightRatio = $(window).height()  / (937);
                console.log($(window).height() );
                //修改比例
                body.setAttribute("style","transform: scale(" + widthRatio  + ", " + heightRatio  + ")")
            }
            setFont();
            // 2、页面改变的时候也需要设置
            // 尺寸改变事件
            window.onresize = function () {
               setFont();
            }
        })();
         </script>

body添加样式

transform-origin: left top;

可以正常计算缩放

原文地址:https://www.cnblogs.com/njccqx/p/13748716.html