页面的自适应方法总结

一、使用前端框架，如bootstrap响应式布局，推荐使用

二、包裹一个容器，设置一个固定宽度如1200px，并设置居中，里面的内容可以写具体的px值，不同电脑显示的两边的空白大小不一样。（传统布局）

三、使用百分比，各个部分都使用百分比。这种编码难度大，难以掌控，测试困难，一般少用。（流式布局）

四、针对不同分辨率写不同css文件，不推荐使用。（包含媒体查询media）（自适应布局）

五、用js/jquery动态调整一些值的大小，但是页面上较多元素都会变形的情况不推荐使用。

六、百分比和em结合使用。

七、使用rem来作为单位写样式，需要借助js来获取分辨率大小调整rem，pc端兼容差，适合移动端。（弹性布局）

推荐一篇文章，讲述很清楚：https://blog.csdn.net/weixin_40290672/article/details/79577740