话不多说直接上代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>rem适配问题</title> <style> *{ margin: 0; padding: 0; } #box{ height: 0.5rem; width: 0.5rem; background: pink; } </style> </head> <body> <div id="box"></div> <script> window.onload = function(){ // 获取屏幕的宽度 var width = document.documentElement.clientWidth; // 获取html var htmlNode = document.querySelector("html"); // 设置字体大小 htmlNode.style.fontSize = width + "px"; } </script> </body> </html>