在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. oracleDB python chines_miscode

    oracle account lock: solutionhttp://www.cnblogs.com/jianqiang2010/archive/2011/09/01/2162574.html li ...

  2. Python_tkinter(5)_GUI工具

    1.Excel行数统计工具 源代码 import xlrd import tkinter as tk import tkinter.filedialog # 计算一个工作簿中所有Sheet表的行数 d ...

  3. 汇编-13.0-int指令

    1.int指令 int指令的格式为:int n,n为中断类型码,它的功能是引发中断过程. 执行int n指令,相当于引发一个中断号为n的中断过程. (1).取中断类型码n: (2).标志寄存器入栈,I ...

  4. input type = file 在部分安卓手机上无法调起摄像头和相册

    移动端H5web 用input type = file 在部分安卓手机上无法调起摄像头拍照,有的也无法访问相册而是直接访问了文档,解决办法是: 加上 accept = "image/*&qu ...

  5. struts 2.5配置

    1.jar包的变动 必需jar包,旧版本: 必需jar包,新版本: 在struts-2.5.16版本的lib目录下没有xwork-core的jar包,原因是被合并到struts-core这个jar里了 ...

  6. 关于asp.net中链接数据库的问题

    学习了asp.net 有web服务器控件和C#代码两部分 那么在做页面时候,需要用到数据库和asp.net的链接 课本上只是说明了和SQL server的链接,本文介绍如何在.net中链接 Acces ...

  7. 爬虫 -----爬取百度时事热点和url

    使用scrapy top.py    爬虫主要工作 pipelines.py    数据保存 main.py   执行脚本 items.py   初始化item

  8. C# 字段和属性

    最大的疑惑就是:有了字段,为什么还要有属性呢? 如果在一个类中有一个公有字段,那么在这个类的外部我们可以自由无阻的使用这个字段,但是如果给这个字段赋了一个很“离谱”的值,那这对程序可能会造成很大的影响 ...

  9. Python学习笔记(Ⅱ)——循环/选择/函数

    一.循环结构 python中提供了for循环和while循环两种操作,没有do……while语句. 1.for循环: 与其他语言中for循环的常见的写法如for (int i=0;i<10;i+ ...

  10. zuul 自定义路由规则

    1,zuul的maven配置 <!--spring cloud 相关包--><parent> <groupId>org.springframework.boot&l ...