自适应手机端根尺寸设置js脚本

<p>为了适用手机端各种尺寸手机，有必要采用rem布局方式，所以就需要下面的这端代码<br/></p><pre style="background-color:#262e37;color:#ffffff;font-family:&#39;Consolas&#39;;font-size:11.3pt;"><span style="color:#660e7a;font-weight:bold;font-style:italic;">window</span>.<span style="color:#660e7a;font-weight:bold;">onload </span><span style="color:#f92672;">= function</span>(){<br/> <span style="color:#66837f;background-color:#191f26;">/*720</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">代表设计师给的设计稿的宽度，你的设计稿是多少，就写多少</span><span style="color:#66837f;background-color:#191f26;">;100</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">代表换算比例，这里写</span><span style="color:#66837f;background-color:#191f26;">100</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">是<br/></span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;"> &nbsp; &nbsp; &nbsp;为了以后好算</span><span style="color:#66837f;background-color:#191f26;">,</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">比如，你测量的一个宽度是</span><span style="color:#66837f;background-color:#191f26;">100px,</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">就可以写为</span><span style="color:#66837f;background-color:#191f26;">1rem,</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">以及</span><span style="color:#66837f;background-color:#191f26;">1px=0.01rem</span><span style="color:#66837f;background-color:#191f26;font-family:&#39;宋体&#39;;">等等</span><span style="color:#66837f;background-color:#191f26;">*/</span><span style="color:#66837f;"><br/></span><span style="color:#66837f;"> &nbsp; &nbsp;</span><span style="font-style:italic;">getRem</span>(<span style="color:#ae81ff;">720</span>,<span style="color:#ae81ff;">100</span>)<br/>};<br/><span style="color:#660e7a;font-weight:bold;font-style:italic;">window</span>.<span style="color:#660e7a;font-weight:bold;">onresize </span><span style="color:#f92672;">= function</span>(){<br/> <span style="font-style:italic;">getRem</span>(<span style="color:#ae81ff;">720</span>,<span style="color:#ae81ff;">100</span>)<br/>};<br/><span style="color:#f92672;">function </span><span style="font-style:italic;">getRem</span>(<span style="color:#fd971f;font-style:italic;">pwidth</span>,<span style="color:#fd971f;font-style:italic;">prem</span>){<br/> <span style="color:#f92672;">var </span><span style="color:#64a2a2;">html </span><span style="color:#f92672;">= </span><span style="color:#660e7a;font-weight:bold;font-style:italic;">document</span>.<span style="color:#4ac60a;">getElementsByTagName</span>(<span style="color:#e6db74;">&quot;html&quot;</span>)[<span style="color:#ae81ff;">0</span>];<br/> <span style="color:#f92672;">var </span><span style="color:#64a2a2;">oWidth </span><span style="color:#f92672;">= </span><span style="color:#660e7a;font-weight:bold;font-style:italic;">document</span>.<span style="color:#660e7a;font-weight:bold;">body</span>.<span style="color:#660e7a;font-weight:bold;">clientWidth </span><span style="color:#f92672;">|| </span><span style="color:#660e7a;font-weight:bold;font-style:italic;">document</span>.<span style="color:#660e7a;font-weight:bold;">documentElement</span>.<span style="color:#660e7a;font-weight:bold;">clientWidth</span>;<br/> <span style="color:#64a2a2;">html</span>.<span style="color:#660e7a;font-weight:bold;">style</span>.<span style="color:#660e7a;font-weight:bold;">fontSize </span><span style="color:#f92672;">= </span><span style="color:#64a2a2;">oWidth</span><span style="color:#f92672;">/</span><span style="color:#fd971f;font-style:italic;">pwidth</span><span style="color:#f92672;">*</span><span style="color:#fd971f;font-style:italic;">prem </span><span style="color:#f92672;">+ </span><span style="color:#e6db74;">&quot;px&quot;</span>;<br/>}</pre><p>参考来源https://www.cnblogs.com/agansj/p/8243880.html</p>