1,在public文件夹中创建js文件夹,新建一个scale.js文件
内容如下
function scale(){
//获取屏幕宽度
const clientWidth = document.documentElement.clientWidth
//对屏幕宽度进行判断
if(clientWidth<1024){
const string = `
<style>
html{
font-size:${clientWidth/390}px
}
</style>
`
document.write(string)
}
}
scale()
然后在HTML页面引入这个js文件
px单位换成rem就OK了
.border-none {
font-size: 16rem;
display: flex;
justify-content: center;
align-items: center;
margin-top: 24rem;
padding: 5rem;
width: 90rem;
background: #f2f2f2;
opacity: 1;
text-align: center;
}