首页 > 移动平台 > 详细

移动端 单位 rem

时间:2016-08-27 21:55:46      阅读:286      评论:0      收藏:0      [点我收藏+]

rem是指相对于根元素的字体大小的单位(相对单位)

rem和em的区别,em相对于父元素的字体大小的单位。rem相对于根元素html字体大小计算,

        px是一个绝对的单位。

所以rem可以实现强大的屏幕适配布局

例如:

html{
      font-size:20px;  
}    
.btn{
      width:6rem;
      height:3rem;            
}    
//<div class=‘btn‘></btn>那么.btn的宽度为120px;高度为60px;

  所以在做移动端适配的时候就要根据不同分辨率设置font-size的值,做法:

(function () {
    var html = document.documentElement;

    function onWindowResize() {
        html.style.fontSize = html.getBoundingClientRect().width / 20 + ‘px‘;
    }
    window.addEventListener(‘resize‘, onWindowResize);
    onWindowResize();
})();

  

 

移动端 单位 rem

原文:http://www.cnblogs.com/yymb/p/5813794.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!