常见的移动端布局解决方案有哪些？原理如何？

①固定布局 采用固定像素
原理：设置好视口，跟PC端写法一样，版心设置320即可
优点：思路沿用pc端，上手简单
缺点：界面两侧留有空白，用户体验差，而且元素略小
②流式布局原理：用百分比代替固定像素，限制布局盒子的最大最小宽度
优点：实现自适应
缺点：只做宽度适配，高度会被拉伸
③rem布局原理：设置跟标签html字体的大小，利用媒体查询不同屏幕宽度下字体的大小，利用相对定位rem代替固定px
优点：宽高字体大小都能自适应，显示效果好
④媒体查询布局原理：利用媒体查询不同的屏幕宽度，给每个不同的设备都写一套样式文件
缺点：复杂，工作量大，后期难维护