欢迎,感谢你能来...

找到回家的路:
首页 > 前端分享 > 判断窗口大小 来改变元素和字体大小
前端分享

判断窗口大小 来改变元素和字体大小

作者:Fanda 发布日期:2019-05-21 围观人数:1966人

简介

把px换成rem如:200px 换成 2rem // 判断窗口大小 来改变元素和字体大小 function comHtmlFontSize() { var WIDTH = document.docum […]



把px换成rem如:200px 换成 2rem

// 判断窗口大小 来改变元素和字体大小
function comHtmlFontSize() {
    var WIDTH = document.documentElement.clientWidth;
    //1920是浏览器的宽度 19.20是1/100倍 方便把px换成rem
    document.documentElement.style.fontSize = (WIDTH / 19.20) + "px"
    // 用于ECharts字体大小 
    window.HTMLFontSize = parseFloat(document.documentElement.style.fontSize);
}
$(window).resize(function() {
  comHtmlFontSize()
});
comHtmlFontSize()



HTMLFontSize用法:

title: {
    left: "35%",
    top: "55%",
    text: " 生产总值",
    textStyle: {
        color: "#aab1bb",
        fontSize: HTMLFontSize*0.44,
    },
    subtext: "¥123111315",
    subtextStyle: {
        color: "#ffffff",
        fontSize: HTMLFontSize*0.34,
    },
}

配图

Tags:

转载 云中不知处博客欢迎分享,转载请说明文章出处“ 来源云中不知处博客 http://www.saymiss.com/archives/158 “。
很赞哦!( 0)

( 0 )个小伙伴在吐槽

访客评论


站点统计

  • 更新时间:2023-04-17 05:40
  • 文章总数:34
  • 评论总数:34
  • 标签总数:25
  • 运行时间: 2053
我的微信
  • 网站赞助:阿里云、腾讯云、百度云、奇虎360、网易云音乐、音悦台、京东商城,哦以上这些都没有。
  • 网站制作:页面设计:Fanda;前端开发:Fanda;后台功能:Fanda;主题开发:Fanda;技术支持:Fanda。我就是天才...
免责声明
  • 1、本站个人博客模板,均为Fanda本人设计,可供个人学习和使用,未经许可不得用于任何商业目的。
  • 2、本站部分文章来自网络,请您放心,所有转载文章内容皆保留来源链接,如本站有著作权属于你的文章内容,而本站并未放上链接或有其他原因侵权,请E-mail: fzh2812@163.com,我会在48小时内删除相关内容,敬请谅解!
碎言碎语
  • 好好珍惜对你好的人,弄丢了上百度也找不回来

    2021-10-25
  • 同在一座城市,为何好久不见!

    2020-11-22
  • 三生有幸遇见你,纵使悲凉也是情

    2020-05-07
  • 忍一时风平浪静,退一步越想越气

    2020-03-21
  • 最近996

    2019-11-09
  • 最近有点忙,996啊

    2019-07-29
  • 端午3天我就没下过楼,出过门

    2019-06-09

©2019 云中不知处 Powered by WordPress 文章归档 免责声明 网站地图 百度统计