11a三阶段1像素边框.pptxVIP

移动端页面布局 陆荣涛 1像素边框 1、问题提出 2、1像素边框实现方案 0.5像素 2、1像素边框实现方案 viewport + rem 在devicePixelRatio = 2 时，输出viewport meta name=viewport content=initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5, user-scalable=no 在devicePixelRatio = 3 时，输出viewport meta name=viewport content=initial-scale=0.3333333333333333, maximum-scale=0.3333333333333333, minimum-scale=0.3333333333333333, user-scalable=no 2、1像素边框实现方案 transform: scale(0.5) height:1px; -webkit-transform: scaleY(0.5); -webkit-transform-origin:0 0; overflow: hidden; 2、1像素边框实现方案 box-shadow 实现方式，利用css 对阴影处理的方式实现0.5px的效果 底部一条线 -webkit-box-shadow:0 1px 1