Flexible适配方案 最早的文章，是15年阿里手淘团队的移动端适配方案。 设计师常选择iPhone6作为基准设计尺寸，交付给前端的设计尺寸是按750px * 1334px为准(高度会随着内容多少而改变)。 前端开发人员通过一套适配规则自动适配到其他的尺寸。 先了解一些基本概念 视窗viewpor ...
分类：
移动开发 时间：
2018-12-29 18:38:50
阅读次数：
256
一、 rem vs em 二、js计算 为了避免造成因为动态设置<html>元素的font-size而造成页面抖动，一般这部分代码我们放在header底部去加载，并内联到html文档里面。 三、媒体查询 参考文档： 简单粗暴的移动端适配方案 - REM ...
分类：
移动开发 时间：
2018-11-26 13:38:50
阅读次数：
206
/** * sass的基本的使用reset.scss * base.scss * DOMContentLoaded:当Dom加载完成 * orientationchange:移动的时候和水平旋转的时候触发 * resize:当调整窗口的时候触发 * http://feg.netease.com/ar ...
分类：
移动开发 时间：
2018-11-22 18:58:09
阅读次数：
215
方法一 flexible 一、npm 包安装 lib-flexible 淘宝适配方案 px2rem px自动转rem 三、配置build/utils.jsvar px2remLoader = { loader: 'px2rem-loader', options: { remUnit: 75 } } ...
分类：
移动开发 时间：
2018-11-07 20:04:23
阅读次数：
324
Calces系列相关文章： "Calces自动实现Android组件化模块构建" 前言 屏幕适配一直是移动端开发热议的问题，但是适配方案往往在实际开发的时候会和UI提供的设计稿冲突。本文主要是基于官方推荐的配置限定符方案（Smallest Width目前Android屏幕适配的最优方案）来实现一个接 ...
分类：
其他好文 时间：
2018-10-21 21:57:33
阅读次数：
264
手淘H5移动端适配方案flexible源码分析 移动端适配一直是一个值得探讨的问题，在业余时间我找了一些页面，查看了一些厂商对于移动端H5页面的适配方案，看到了几个典型的例子，今天就来记录一下我看到的第一个典型的例子，也是我们公司目前普通H5项目正在使用的适配方案。 这个适配方案是lib-flexi ...
分类：
移动开发 时间：
2018-10-15 18:20:41
阅读次数：
1555
移动端适配一直是一个值得探讨的问题，在业余时间我找了一些页面，查看了一些厂商对于移动端H5页面的适配方案，看到了几个典型的例子，今天就来记录一下我看到的第一个典型的例子，也是我们公司目前普通H5项目正在使用的适配方案。 这个适配方案是lib-flexible，在看这个源码的同时，我想先来回顾一下几个 ...
分类：
移动开发 时间：
2018-10-14 21:54:58
阅读次数：
258
移动端主要采用 "rem布局" ，vue+webpack，通过webpack编译，将css中px自动转成rem或其它单位，这里采用px2rem loader进行转换，最后引入lib flexible，实现不同设备不同分辨率的弹性适配。 实现步骤 第一步：引入lib flexible 下载lib fl ...
分类：
移动开发 时间：
2018-10-01 00:16:08
阅读次数：
340
一、原因 固定定位是参考布局视口做定位的，而在移动端，存在布局视口、视觉视口、理想视口，如果适配方案使用不正确，很容易造成布局错误。 二、案例1，有问题版本，在唤起虚拟键盘的时候，布局错乱了。 三、案例2，绝对定位版本，布局没有错乱， 效果是没有错乱的，使用绝对定位，头部和尾部都是相对body进行定 ...
分类：
移动开发 时间：
2018-09-12 01:17:32
阅读次数：
283
基于rem的移动端响应式适配方案(详解) ： https://www.jb51.net/article/118067.htm 移动端H5页面的设计稿尺寸大小规范 http://www.tuyiyi.com/v/53039.html ...
分类：
移动开发 时间：
2018-08-26 10:30:23
阅读次数：
184
