npm install lib-flexible --save
npm install px2rem-loader --save-dev
 
rule
.use('px2rem-loader')
.loader('px2rem-loader')
.options({emUnit:37.5})
 
正常移动端范围是375到750
我们这样设定就是让1rem为37.5px
相当于将页面（375px）分成十份，每一份就是1rem（37.5px）
rem就是相对于根元素，即<html>
 
 
import 'lib-flexible/flexible.js'
 
这样我们就可以按照设计图的px来做了，他会根据屏幕大小帮我们转换为对应的rem值
 
 

移动端适配flexible.js的更多相关文章

  1. 移动端适配--flexible.js

    引言: H5适配一直是一个比较普遍的问题,很多文章都会讲,最近开发了一个H5的项目使用了一下淘宝的 flexible.js,写一篇文章自己总结一下. 一.背景介绍: Flexible.js是淘宝公开的 ...

  2. vue.js移动端配置flexible.js

    前言 最近在用vue做移动端项目,网上找了一些移动端适配的方案,个人觉得手淘团队flexible.js还是比较容易上手,在这里做下总结. 主体 flexible.js适配方案采用rem布局,根据屏幕分 ...

  3. vue脚手架搭建移动端项目--flexible.js

    通过命令行 node -v 查看是否安装node环境 在 nodejs 和 webpack已安装的前提下,随便一个文件夹下,输入命令行 npm install vue-cli -g 安装完成后,通过 ...

  4. vue-cli配置移动端自适应flexible.js

    第一部分:项目中引入lib-flexible 一.项目中安装lib-flexible npm install lib-flexible --save-dev 二.在项目入口文件main.js中引入li ...

  5. 淘宝适配 flexible.js

    1.引入 阿里cdm文件,也可以自己下载下来引用,不需要在添加<meta name="viewport"">标签了 <script src=" ...

  6. 【前端开发】移动端适配方案js，rem单位转换，640设计稿20px=1rem

    ! function() { var style = document.createElement("STYLE"), docEl = document.documentEleme ...

  7. css样式重置 移动端适配

    css  默认样式重置 @charset "utf-8"; *{margin:0;padding:0;} img {border:none; display:block;} em, ...

  8. 从flexible.js引入高德地图谈起的移动端适配

    曾几何时,前端还仅仅是PC端的.随着移动时代的兴起,h5及css3的推陈出新.前端的领域慢慢的由传统的pc端转入了移动端,这也导致了前端这一职业在风口的一段时间出尽了风头. 从开始的惶恐和无从下手,慢 ...

  9. 移动端适配方案 flexible.js

    前言 移动端适配一直以来都是前端开发中不可或缺的重要组成部分,如果没有了它,那么你做出来的页面极有可能会出现各种意外(写出来的页面与设计稿之间的差别).所有我们得找到一种相对来说让人比较满意的解决方案 ...

随机推荐

  1. SQL Server中的加密

    参考文献: 细说SQL Server中的加密 Transparent Data Encryption (TDE) Database Encryption Key (DEK) management SQ ...

  2. 欧姆龙_NX1P_PLC功能模块_限定安全作业空间

    程序  和说明 以及流程图 已上传到百度云盘 https://pan.baidu.com/s/1kYF11pQHJ4VxyaXr8E_gAA 主要是用来向量的叉乘  判断俩向量正向夹角

  3. Hanoi II——汉诺塔步数求解进阶问题

    在NOJ上遇到关于汉诺塔步数的求解问题 开始读时一脸懵逼,甚至不知道输入的数据是什么意思 题目描述:给出汉诺塔的两个状态,从初始状态移动到目的状态所需要的最少步数 对于初级汉诺塔步数问题,我们可以直接 ...

  4. Linux 教程学习笔记

    目录 一.Linux 系统启动过程 1.分为 5 个阶段 3.shell.操作系统.内核的关系 二.Linux 系统目录结构 三.Linux 文件基本属性 1.Linux文件属性 3.更改文件属性: ...

  5. @Value注入static属性

    1. 给参数注入,执行set方法 public class SendMessageCenter {     private static String message;    private stat ...

  6. for i in range()

    for i in range()就是python中的循环语句 有以下三种常见用法: 1.range(3) [0,3)即0,1,2 2.range(1,3) [1,3)即1,2 3.range(1,5, ...

  7. Alt+~,Alt+Tab

    Alt+~可以很方便的切换同一个软件中的内容. Alt+Tab可以很方便的切换不同软件之间的内容. 熟练使用,很方便.

  8. [转帖]APP逆向神器之Frida【Android初级篇】

    APP逆向神器之Frida[Android初级篇] https://juejin.im/post/5d25a543e51d455d6d5358ab 说到逆向APP,很多人首先想到的都是反编译,但是单看 ...

  9. 【基本优化实践】【1.6】在sql server修改且移动数据库文件位置

    在master数据库中,SQL Server提供系统扩展的存储过程,其中有一些存储过程的命名以xp_开头,用于处理操作系统的文件. 一,判断文件是否存在 存储过程sys.xp_fileexist 用于 ...

  10. ORA-12514错误分析

    ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法   ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 有同事遇到这个问题,现总结一下,原因如下: ...