rem适配手机
作者：互联网
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
6 <title>Title</title>
7 <style type="text/css">
8 *{
9 margin: 0;
10 padding: 0;
11 }
12
13 #box{
14 width:0.5rem;
15 height:0.5rem;
16 background: red;
17 }
18 </style>
19 </head>
20 <body>
21 <div id="box"></div>
22 </body>
23
24 <script type="text/javascript">
25 window.onload =function(){
26 var width =document.documentElement.clientWidth;
27 console.log("width:",width)
28 var htmlNode =document.querySelector('html');
29 console.log("htmlNode:",htmlNode)
30 htmlNode.style.fontSize=width + 'px'
31 console.log("htmlNode2:",htmlNode.style.fontiSize)
32 }
33 </script>
34 </html>
1、 var width =document.documentElement.clientWidth 获取手机的宽度像素
2、 var htmlNode =document.querySelector('html'); 获取html的元素
3、htmlNode.style.fontSize=width + 'px' 将html默认的16px换成手机的像素，后面就是1rem;
标签：htmlNode,适配,width,html,rem,var,手机,document 来源： https://www.cnblogs.com/yinhao-jack/p/10748764.html