扫码关注官方订阅号
移动端的rem是必须和媒体查询配合使用嘛?不同分辩率利用媒体查询来设置字体大小,我看有的帖子用了,有的帖子没用。谢谢!
小伙看你根骨奇佳,潜力无限,来学PHP伐。
先用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单位
不是必须的。可以给根节点设置字体大小:
html { font-size: 10vw; }
根节点字体大小是屏幕宽度的 1/10 ,然后使用 rem。
ps:根节点字体大小到底设置多少个 vw。。。看个人习惯吧。。。
楼主,我也刚开始研究这方面,你可以看看这文章,看明白就知道怎么回事了!移动端高清、多屏适配方案从网易与淘宝的font-size思考前端设计稿与工作流
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
先用js动态计算字体
然后使用rem单位
不是必须的。可以给根节点设置字体大小:
根节点字体大小是屏幕宽度的 1/10 ,然后使用 rem。
ps:根节点字体大小到底设置多少个 vw。。。看个人习惯吧。。。
楼主,我也刚开始研究这方面,你可以看看这文章,看明白就知道怎么回事了!
移动端高清、多屏适配方案
从网易与淘宝的font-size思考前端设计稿与工作流