vue web项目如何做屏幕分辨率适配

Vue Web项目的屏幕分辨率适配可以通过CSS的媒体查询（Media Query）实现。以下是一些常见的做法：

1. 使用rem作为单位。在html标签中设置一个基准字体大小，然后在CSS中使用rem作为单位进行布局。同时，通过媒体查询根据屏幕宽度来设置基准字体大小，从而实现屏幕适配。

2. 使用vw和vh作为单位。vw表示视口宽度的百分比，vh表示视口高度的百分比。通过设置元素的宽度、高度等属性时使用vw和vh作为单位，可以实现屏幕适配。

3. 使用flexbox布局。flexbox布局可以很好地适应不同屏幕大小。通过设置flex容器的属性，可以实现自适应布局。

需要注意的是，在进行屏幕适配时，应考虑到不同屏幕大小的设备的DPR（Device Pixel Ratio）。可以使用Meta标签设置viewport的缩放比例，从而实现DPR的适配。