1.index页面
- 保证页面1:1且用户不能放大页面
- initial-scale - 初始的缩放比例
- minimum-scale - 允许用户缩放到的最小比例
- maximum-scale - 允许用户缩放到的最大比例
- user-scalable - 用户是否可以手动缩放
2.默认样式不统一问题
问题描述:不同手机浏览器默认的样式不统一的问题,统一样式
解决方法:引入reset.css文件
3. 1像素边框问题
问题描述:有些手机的屏幕分辨率较高,是2-3倍屏幕。css样式中border:1px solid red;在2倍屏下,显示的并不是1个物理像素,而是2个物理像素。为了解决这个问题,引入border.css是非常有必要的。
解决办法:引入border.css文件
ps:以上两个文件均放在styles文件夹里
4.移动端300ms点击延迟问题
问题描述:当我们点击页面的时候移动端浏览器并不是立即作出反应,而是会等上一小会儿才会出现点击的效果。双击缩放是会有 300 毫秒延迟的主要原因。
解决方法:安装faster.click库,npm install fastclick --save
然后引入
5. iconfont管理 在https://www.iconfont.cn/ 注册账号并新建一个项目进行图标管理
6.将自动生成的用不到的代码删除
7.将本地代码同步到线上