6***@qq.com
6***@qq.com
  • 发布:2019-12-22 17:00
  • 更新:2020-02-09 21:43
  • 阅读:11598

uniapp中怎么设置页面字体大小

分类:uni-app

原有一个H5页面,现在转为uniapp。vue页面。
原H5页面,自动根据屏幕宽度设置字体大小。

代码如下:
var pagew = document.documentElement.clientWidth;
document.documentElement.style.fontSize = (pagew > 720 ? 720 : pagew) / 7.2 + "px";

问:在vue页面中怎么动态设置页面字体的大小?
const pagew = uni.getSystemInfoSync().screenWidth; // 获取屏幕宽度
....动态设置页面字体怎么写了?

2019-12-22 17:00 负责人:无 分享
已邀请:
6***@qq.com

6***@qq.com (作者)

自顶

6***@qq.com

6***@qq.com (作者)

有知道解决的吗,有偿

7***@qq.com

7***@qq.com

解决了吗

1***@163.com

1***@163.com - www.difengze.com

const pagew = uni.getSystemInfoSync().screenWidth;
var htmlFont = document.getElementsByTagName('html')[0];
//htmlFont.style.fontSize = (pagew > 720 ? 720 : pagew) / 7.2 + "px";
htmlFont.style.fontSize = (pagew > 720 ? 115.2 : pagew) / 7.2 + "px";

这样试下,如果解决了请点个赞~

  • 7***@qq.com

    这是在h5才有效,这个我知道,但是现在是在uniapp内 app端没用

    2020-02-15 14:53

  • 1***@163.com

    回复 7***@qq.com: 使用html模板,再模板里这样写:

    <script>

    document.addEventListener('DOMContentLoaded', function() {

    //document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'

    //if(document.documentElement.clientWidth > 600)

    //{

    document.documentElement.style.fontSize = '18.75px';

    //}

    })

    </script>

    <link rel="stylesheet" href="<%= BASE_URL %>static/index.css" />

    </head>

    <body>

    <!-- 该文件为 H5 平台的模板 HTML,并非应用入口。 -->

    <!-- 请勿在此文件编写页面代码或直接运行此文件。 -->

    <!-- 详见文档:https://uniapp.dcloud.io/collocation/manifest?id=h5-template -->


    如果可以请点赞

    2020-02-19 18:21

  • 1***@163.com

    回复 1***@163.com: 在APP端运行的时候document直接报错了。H5和小程序的时候可以这么写。

    2021-11-06 15:20

该问题目前已经被锁定, 无法添加新回复