一、在public文件夹中的html文件进行配置:

 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=1.0">

 使移动端用户手指拖动放大缩小无效化(页面比例1:1);

二、引入reset.css对页面样式进行重置: (可到网上去下载)

  1. 在src目录下的assets文件夹中创建一个styles文件夹  把下载好的reset.css文件放到styles文件夹中

  2.在项目中应用resets.css文件:

    在入口文件main.js中引入resets.css文件

import './assets/styles/reset.css' //样式重置文件

三、引入border.css文件:(1像素边框的解决方案)

   1. 在src目录下的assets文件夹中的styles文件夹  把下载好的border.css文件放到styles文件夹中

   2.在项目中应用border.css文件:

    在入口文件main.js中引入border.css文件

import './assets/styles/border.css' //1像素边框的解决方案

四、解决300毫秒点击延迟的问题:

  1.安装一个第三方模块

npm install fastclick --save  // 安装依赖

  2.在项目中引入这个依赖

import fastClick from 'fastclick' //300毫秒点击延迟问题的解决方案(尤其是移动端)优化用户体验

  3.使用fastclick

fastClick.attach(document.body);//fastclick自带的一个方法
posted on 2019-10-30 15:15  yu_bin  阅读(922)  评论(0编辑  收藏  举报