怎么样解决页面缩放问题

在页面缩放的时候,原本的使用数字设置布局就会被打乱,一些css代码,像margin,图片轮播难设置百分比,想问问各位大佬有没有办法处理

如果你要全尺寸适配的话,我建议你可以使用rem布局,我自己写小demo都是这么干的,什么小手机还是平板都是一样的显示,如果是公司项目的话肯定是得媒体查询做不同的适配页面的。

  1. 我是用rem加vw的方式做全局适配。因此你会看到我使用长度一般是rem/20这种奇怪的单位,1rem等于html的font-size100/750vw*20,1vw是百分之一屏幕宽,则750rem/20就是100vw,就是一整个屏幕宽度,一般的ui设计图是750px,也就是只要把设计图上的1px当作1rem/20单位就可以进行任何设备的适配了。
  2. less可以自动计算,css你得将上方尺寸有乘除的部分自己计算后写。
  3. 有个副作用就是导入组件库,一般的组件库仍然是px,而我们全局自己写的内容是rem,回导致缩放时组件的尺寸会有问题,所以导入组件也得自行去深度修改样式。
html {
  font-size: 100/750vw*20;
}