使用rem适配移动端

使用rem适配移动端

在main.js设置字体大小

//以屏幕宽度为375为例
const winWidth = window.innerWidth;//获取屏幕宽度
const fontSize = winWidth / 375 * 20;
document.getElementsByTagName('html')[0].style.fontSize = fontSize + 'px';//设置根元素字体

<div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
</div>

• 使用less

/*    *.less    */
@r:40rem; /*设计稿宽度以750为例*/
.home{
	width: 750/@r;
}