原有一个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; // 获取屏幕宽度
....动态设置页面字体怎么写了?
4 个回复
6***@qq.com (作者)
自顶
6***@qq.com (作者)
有知道解决的吗,有偿
7***@qq.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