我在VUE里的index里面内联了代码,好像没用啊.不知道哪里写错了
<script>
let WHITH=0;
function setFontsize(){
//获取设备屏幕宽度
if(window.innerWidth){
WHITH=window.innerWidth;
}else if(document.documentElement.clientWidth){
WHITH=document.documentElement.clientWidth;
}else if(document.documentElement.getBoundingClientRect().width){
WHITH=document.documentElement.getBoundingClientRect().width
}
console.log(WHITH);
//计算缩放比
const FontSize=(WHITH / 750) * 40
//获取根元素
let HTML=document.querySelector("html");
HTML.style.fontSize=FontSize+"px";
// --------------------动态改变缩放比-------------------------//
//判断meta标签存在不
if(!document.querySelector('[name=viewport]')){
//获取设备像素比
let dpr= window.devicePixelRatio;
//判断dpr是被否为小数
dpr=dpr>=3?3:(dpr>=2?2:1);
//获取缩放比
dpr=1 /dpr;
//使当前DRP可视化
HTML.setAttribute('data-dpr', dpr);
let content = 'width=device-width,initial-scale=' + dpr + ',maximum-scale=' + dpr + ',minimum-scale=' + dpr +',user-scalable=no';
//创建META标签
let META=document.createElement('meta');
META.setAttribute('name','viewport');
META.setAttribute('content',content);
document.head.appendChild(META);
}
}
//页面加载执行一次
setFontsize();
//页面缩放执行
window.addEventListener("resize",setFontsize);
</script>
正在回答 回答被采纳积分+1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>vuedemo02</title>
<style>
*{
box-sizing: border-box;
margin: 0;
padding: 0;
}
html,body{
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="app"></div>
<script src="/dist/build.js"></script>
<script>
let WHITH=0;
function setFontsize(){
//获取设备屏幕宽度
if(window.innerWidth){
WHITH=window.innerWidth;
}else if(document.documentElement.clientWidth){
WHITH=document.documentElement.clientWidth;
}else if(document.documentElement.getBoundingClientRect().width){
WHITH=document.documentElement.getBoundingClientRect().width
}
console.log(WHITH);
//计算缩放比
const FontSize=(WHITH / 750) * 40
//获取根元素
let HTML=document.querySelector("html");
HTML.style.fontSize=FontSize+"px";
// --------------------动态改变缩放比-------------------------//
//判断meta标签存在不
if(!document.querySelector('[name=viewport]')){
//获取设备像素比
let dpr= window.devicePixelRatio;
//判断dpr是被否为小数
dpr=dpr>=3?3:(dpr>=2?2:1);
//获取缩放比
dpr=1 /dpr;
//使当前DRP可视化
HTML.setAttribute('data-dpr', dpr);
let content = 'width=device-width,initial-scale=' + dpr + ',maximum-scale=' + dpr + ',minimum-scale=' + dpr +',user-scalable=no';
//创建META标签
let META=document.createElement('meta');
META.setAttribute('name','viewport');
META.setAttribute('content',content);
document.head.appendChild(META);
}
}
//页面加载执行一次
setFontsize();
//页面缩放执行
window.addEventListener("resize",setFontsize);
</script>
</body>
</html>
- 参与学习 人
- 提交作业 622 份
- 解答问题 6815 个
微信带火了小程序,也让前端工程师有了更多的展现机会,本阶段带你从移动基础知识的学习到webAPP开发,及小程序开发,让你PC端与移动端两端通吃。
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星