html自适应

前言&＃xff1a;做项目的时候发现自适应是个很重要的事情&＃xff01;&＃xff01;&＃xff01;所以了解了很多怎么去做自适应。找到了一种比较好的方法。

下面是基于vue框架的自适应

在App.vue中写入


html,body{font-size: calc(100vw/80);
}



接着在其他的页面以rem作为单位即可。

注&＃xff1a;

1、上面的calc只是做项目时试的合适尺寸&＃xff0c;不合适可以再改

2、在页面中应用时&＃xff0c;最外面的盒子最好不要使用%作为单位&＃xff0c;否则页面会随着屏幕缩放&＃xff0c;最外面的盒子最好使用rem作为单位

3、对于宽度为页面100%的盒子&＃xff0c;使用rem时可能不太好找到那个值&＃xff0c;所以这种盒子最好去做另一种自适应。