美文网首页
关于rem单位的自适应字号

关于rem单位的自适应字号

作者: infi_ | 来源:发表于2017-11-23 17:43 被阅读0次
(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 = 100 * (clientWidth / 640) + 'px';
        };

    if (!doc.addEventListener) return;
    win.addEventListener(resizeEvt, recalc, false);
    doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);

1rem=100px;

相关文章

  • 关于rem单位的自适应字号

  • web移动端REM适配

    一、REM适配原理 rem是相对单位,rem是相对于HTML标签的字号计算结果,1rem = 1HTML字号大小。...

  • HTML学习之图片字体适配

    移动h5 图片字体等适配WebApp开发之--"rem"单位Rem实现自适应初体验手机端页面自适应解决方案—rem布局

  • rem原理详解

    rem原理是根据html的根字号来设置,rem是一个相对单位,就死相对这个根字号的, 不同的设备上动态的设置rem...

  • tm

    1、css的单位相对长度单位:px em(当前元素内字号大小) ex(当前元素内字号x的大小) rem(相对于根元...

  • h5自适应布局

    首先贴出js原生自适应布局的代码: 这是rem布局的核心代码。 什么是rem?rem是个低调的css单位,手淘在移...

  • 字体自适应 rem单位

    大屏字体自适应(rem)vuehttps://www.jianshu.com/p/fd5adf1c7c57[htt...

  • 淘宝flexible.js+rem适配pc端

    在页面引入此js,然后所有px换成rem单位,即可实现自适应。vscode有插件可以自动计算px和rem的转换 下...

  • 2018-04-03 动态REM

    手机专用的自适应方案em是个单位,一个m的宽度rem r表示root rem:根元素的font-size 页面...

  • rem-自适应兼容

    750设计图 px单位 / 100 = rem ;使用时候写进header script 标签/*** 自适应布...

网友评论

      本文标题:关于rem单位的自适应字号

      本文链接:https://www.haomeiwen.com/subject/qbttbxtx.html