js設置html根節點的style字體【Vue動態調整全局字體大小】


html根節點即<html></html>

❌直接用document.getElementByTagName('HTML')獲取不成功

✅要使用document.documentElement,如下

var docEl = document.documentElement
docEl.style.fontSize = '20px'

 PS:配合'postcss-pxtorem'插件,並用上述方式動態修改根元素的字體,可以實現【動態調整全局字體大小】的功能,

配置postcss-pxtorem,只需在postcss.config.js中寫:

module.exports = {
  plugins: {
    autoprefixer: {},
    'postcss-pxtorem': {
      rootValue: 16, 
      propList: ['font-size'] // 只轉化font-size
        // propList: ['*'], // 轉化全部
        // propList: ['*','!border'], //轉化全部,除了border屬性
        // selectorBlackList: ['body'] // 過濾掉.am-開頭的class,不進行rem轉換
    }
  }
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM