由于手机屏幕尺寸不一样，分辨率不一样，或者需要考虑横竖屏的问题，或者考虑到移动端兼容性。这时候你也就不得不解决在不同手机上，不同情况下的展示效果，所以就需要一个开箱即用并且行之有效的移的移动端适配方案

不知不觉在网易已有三年半，占了一半时间都在与移动端打交道，整个阶段都是遇坑填坑的学习过程。移动端开发在前端里像神一样地存在，不是说它多难而是说它坑位实在太多了，怎样填都填不完。Android和iOS各显神通，Android的系统版本和屏幕分辨率多得难以一招兼容，iOS的顽固标准…

在过去的几年时间里，移动端web野蛮生长，智能机的Android阵营和IOS阵营分庭抗礼，随之产生了多个系统版本（系统版本多样）；五花八门的屏幕尺寸、屏幕展示技术（如大名鼎鼎的Retina技术屏）层出不穷（屏幕尺寸、技术多样），还是CSS的W3C标准在各式各样的移动端浏览器上落…

css中的像素只是一个抽象的单位，在不同的设备或不同的环境中，css中的1px所代表的设备物理像素是不同的,1px并不是绝对的,它只代表了当前设备像素的最小单位. CSS像素，当页面缩放比例为100%时，一个CSS像素等于一个设备独立像素。 但是CSS像素是很容易被改变的，当用…

2. 1px边框的问题 2. background-image 和border-image类似，准备一张符合条件的边框背景图，模拟在背景上。 上面两种都需要单独准备图片，而且圆角不是很好处理，但是可以应对大部分场景。 这种方式可以满足各种场景，如果需要满足圆角，只需要给伪类也加…

转转App是我们公司最核心的产品，引导用户到转转App中来，对用户增长和留存十分重要。常见的做法是在各个流量入口，投放Web版的引流页面，然后通过该页面唤起App（下文简称唤端）。本文重点介绍转转是如何在各种场景下，完成整个唤端流程的。 如上图，在Safari浏览器中，当我们点…

移动端的屏幕大小各异,尤其是安卓机,千奇百怪,各种尺寸的机型都有,而且有1倍屏,2倍屏，3倍屏之分，作为精益求精的前端，我们希望找到一种完美适配各种机型的方案。rem是现在主流的移动端自适应布局方案，本文主要介绍了rem布局的原理和通用方案 首先说一下，我们想要达到的自适应效果…

1. 视口 viewport viewport 解释为中文就是‘视口’的意思，也就是浏览器中用于显示网页的区域。在 PC 端，其大小也就是浏览器可视区域的大小，所以我们也不会太关注此概念；而在移动端，绝大多数情况下 viewport 都大于浏览器可视区，保证 PC 页面在移动浏…

Rem布局的原理解析