javascript - 移动端的rem是必须和媒体查询配合使用嘛?
伊谢尔伦
伊谢尔伦 2017-04-11 12:16:53
[JavaScript讨论组]

移动端的rem是必须和媒体查询配合使用嘛?不同分辩率利用媒体查询来设置字体大小,我看有的帖子用了,有的帖子没用。谢谢!

伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

全部回复(3)
黄舟

先用js动态计算字体

 <script type="text/javascript">
        (function(doc, win) {
            var docEl = doc.documentElement,
                    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                    recalc = function() {
                        var clientWidth = docEl.clientWidth;
                        if (!clientWidth) return;
                        docEl.style.fontSize = (clientWidth >= 640 ? 100 : clientWidth / 6.4) + 'px';
                    };
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window);
    </script>

然后使用rem单位

PHPz

不是必须的。可以给根节点设置字体大小:

html {
  font-size: 10vw;
}

根节点字体大小是屏幕宽度的 1/10 ,然后使用 rem。

ps:根节点字体大小到底设置多少个 vw。。。看个人习惯吧。。。

伊谢尔伦

楼主,我也刚开始研究这方面,你可以看看这文章,看明白就知道怎么回事了!
移动端高清、多屏适配方案
从网易与淘宝的font-size思考前端设计稿与工作流

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号