remrem 是相对长度单位，相对的是根元素<html>的字体大小font-size em在font-size中使用是相

rem 是相对长度单位，相对的是根元素<html>的字体大小font-size
em在font-size中使用是相对于父元素的字体大小，在其他属性中使用是相对于自身的字体大小，如width

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        html{font-size: 16px;}
        div{font-size: 1rem;}
    </style>
</head>
<body>
    <div>欢迎光临！！</div>
    <script>
       function setHtmlFontSize(){
            //获取当前视口的宽度
            // 1. 浏览器
            console.log(document.documentElement.clientWidth)
            // 设计稿的宽度 350px
            // 设计稿的font-size=16px
            const defaultWidth = 350;
            const defaultFontsize = 16
            let actualWidth = document.documentElement.clientWidth
            let actualFontsize = Math.floor(actualWidth * defaultFontsize / defaultWidth)
            console.log(actualFontsize)
            document.documentElement.style.fontSize =  actualFontsize + 'px'
       }

       setHtmlFontSize()

        window.addEventListener('resize', ()=>{
             setHtmlFontSize()
        })
    </script>
</body>
</html>