在vue中配置rem

位置:在APP.vue的script中,在export default之外

(()=>{

  let winW = document.documentElement.clientWidth,

  desW = 1440,

  htmlFont = winW / desW * 100;

  window.htmlFont = htmlFont;

  document.documentElement.style.fontSize = htmlFont + 'px';

})()

浏览器的兼容性之Mate标签

在vue项目index.html中

是否启用WebApp全屏模式,删除苹果默认的工具栏

<mate name="apple-touch-fullscreen" content="yes" />

启用360极速模式

<mate name="renderer" content="webkit" />

针对老的手持设备优化,不识别viewport

<mate name="HandheldFriendly" content="true" />

uc强制竖屏

<mate name="screen-orientation" content="portrait" />

QQ强制竖屏

<mate name="x5-orientation" content="portrait" />

UC强制全屏

<mate name="full-screen" content="yes" />

qq强制全屏

<mate name="x5-fullscreen" content="true" />

UC应用模式

<mate name="browsermode" content="application" />

QQ应用模式

<mate name="x5-page-mode" content="app" />

windows phone 点击无高光

<mate name="msapplication-tap-highlight" content="no" />

不被显示为拨号连接

<mate name="format-detection" content="telephone=no" />

优先使用IE最新版本和chrome

<mate http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" >

浏览器页面头像

<link rel="shortcut icon" href="图片路径" type="image/x-icon"/>

rem的在vue项目中使用配置,,浏览器的兼容性之Mate标签的更多相关文章

  1. Vue 项目中 ESlint 配置

    前言 对于 ESlint 这一块一直存在一些疑问,今天看到一个文章内容挺好的,这里拿来了. 一.eslint 安装 1.全局安装 npm i -g eslint 全局安装的好处是,在任何项目我们都可以 ...

  2. vue项目中全局配置变量

    在项目中api管理需要用到全局变量,创建全局变量的方式也有很多. 1.通过export default const BASEURL = "http://localhost:3333/&quo ...

  3. vue项目中postcss-pxtorem的使用及webpack中的配置 css中单位px和em,rem的区别

    移动手机版要求我们在制作嵌入h5的时候去适配不同的手机.适配有多重模式,有flex.百分比等.字体大小的控制也有px.百分比.rem等单位,webpack中 px转rem. vue项目中postcss ...

  4. 在vue项目中的axios使用配置记录

    默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...

  5. 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap

    1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...

  6. 转:如何在Vue项目中使用vw实现移动端适配

    https://www.w3cplus.com/mobile/vw-layout-in-vue.html 有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flex ...

  7. 在Vue项目中使用vw实现移动端适配

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

  8. 如何在Vue项目中使用vw实现移动端适配(转)

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

  9. Vue项目中使用vw实现移动端适配

    我们在vue移动端项目中的适配一般都采用rem,但是rem也不是能兼容所有的终端. 随着viewport单位越来越受到众多浏览器的支持,下面将简单介绍怎么实现vw的兼容问题,用vw代替rem 当我们采 ...

随机推荐

  1. CSIS 1119B/C Introduction to Data Structures and Algorithms

    CSIS 1119B/C Introduction to Data Structures and Algorithms Programming Assignment TwoDue Date: 18 A ...

  2. python 数据分析算法(决策树)

    决策树基于时间的各个判断条件,由各个节点组成,类似一颗树从树的顶端,然后分支,再分支,每个节点由响的因素组成 决策树有两个阶段,构造和剪枝 构造: 构造的过程就是选择什么属性作为节点构造,通常有三种节 ...

  3. photoshop 修改pdf文件并保存为pdf

    1.CTRL + O   打开要编辑的pdf文件 按住shift 选中每一页,点击确定. pdf文档每一页以一个psd文件显示在工作区, 分别进行修改, 2.批量修改同一个元素(比如加个图标) 在一页 ...

  4. php java aes

    class CryptAES{ protected $cipher = MCRYPT_RIJNDAEL_128; protected $mode = MCRYPT_MODE_ECB; protecte ...

  5. 【Linux】Centos partition

    http://www.cnblogs.com/yogurtwu/p/9494108.html https://www.cnblogs.com/zhangkaimin/p/6251448.html wh ...

  6. 【Common】-NO.122.common.1 - pv、uv、ip,tps、qps、rps术语

    Style:Mac Series:Java Since:2018-09-10 End:2018-09-10 Total Hours:1 Degree Of Diffculty:5 Degree Of ...

  7. pandas处理时间序列(3):重采样与频率转换

    五.重采样与频率转换 1. resample方法 rng = pd.date_range('1/3/2019',periods=1000,freq='D') rng 2. 降采样 (1)resampl ...

  8. upCode

    更新源码 Sub main() Dim str As String str = "这是测试的字符串对话框" MsgBox str Sheets(1).Select End Sub

  9. 华为AR-111S路由器GRE协议设置

    一.GRE的定义: gre(generic routing encapsulation,通用路由封装)协议是对某些网络层协议(如ip 和ipx)的数据报进行封装,使这些被封装的数据报能够在另一个网络层 ...

  10. cnpm安装失败

    解决办法: 先:npm config set registry "http://registry.npmjs.org/" 再:npm install -g cnpm