rem 之js代码获取font-size值（适合移动手机端）

　　这两天学的是自适应，代码有点乱。而且这几天忙着写实习报告，也没有时间去整理。

　　但是，这下面代码吧，是可以获取html的font-size值的，然后用来设置相对单位rem的从而达到自适应效果的；看到红色的width了吧，把它改成你屏幕宽度就好，比如我的是1920px；那么这样算出来html{font-size：600px}； 这样的话你要设置其他元素的rem，比如span{font-size：12px；}，要自适应就用12/600，就是0.02rem，span{font-size：0.02rem；}这样你的span字体就随屏幕大小也变了，或者你要设置图片啊傻的，也是用它的宽或者高除于600。

　　至于你要pc端和手机端分开效果什么的，用@media分别写CSS样式就哦了。

 <script>
        !(function(doc, win) {
            var docEle = doc.documentElement,//获取html元素
                event = "onorientationchange" in window ? "orientationchange" : "resize",//判断是屏幕旋转还是resize;
                fn = function() {
                    var width = docEle.clientWidth;
                    width && (docEle.style.fontSize = 100  * (width / 320) + "px");//设置html的fontSize，随着event的改变而改变。
                };
            
            win.addEventListener(event, fn, false);
            doc.addEventListener("DOMContentLoaded", fn, false);
        
        }(document, window));
    </script>

转载于:https://www.cnblogs.com/liaoliao985786516/p/5605274.html

总结

以上是生活随笔为你收集整理的rem 之js代码获取font-size值（适合移动手机端）的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。