移动端相对于PC端的页面最大的不同就是移动端的页面需要适配任何尺寸的手机屏幕：
1. 首先移动端页面的高度最好不要设置，因为不管实际文档的高度有多高，手机是可以上下滑动的；
2. 布局上，左右的布局最好使用弹性布局（弹性布局就是比如一个父级div下有两个子级div ---A、B，父级元素给display: flex; 子级A的div给 flex: 1; B不做操作），这样B宽度就是实际内容的宽度，而给了flex属性的子级A的宽度就等于父级元素的宽度减B所占用的宽度。
3. 注意头部要加上<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />，如果不加这个代码，页面会出现双击布局混乱（比如页面放大）。
4. 移动端页面的尺寸最好使用百分比作为单位，以此来实现自动适配的目的。