首页 > 移动平台 > 详细

box-shadow实现移动端(Retina屏)超细边框

时间:2017-08-04 20:26:19      阅读:693      评论:0      收藏:0      [点我收藏+]
// box-shadow投影方向
//
box-shadow:  inset 0px 1px 0px 0px #000; 
//
box-shadow:  inset -1px 0px 0px 0px #000;
//
box-shadow:  inset 0px -1px 0px 0px #000;
//
box-shadow:  inset 1px 0px 0px 0px #000;

效果如下:

技术分享

技术分享

技术分享

技术分享

  因为css中的1px并不等于移动设备的1px,这些由于不同的手机有不同的像素密度。  

  在window对象中有一个devicePixelRatio属性,他可以反应css中的像素与设备的像素比。

devicePixelRatio的官方的定义为:设备物理像素和设备独立像素的比例,也就是 devicePixelRatio = 物理像素 / 独立像素。

  多更解决方法参阅:http://www.jianshu.com/p/7e63f5a32636

box-shadow实现移动端(Retina屏)超细边框

原文:http://www.cnblogs.com/hcxwd/p/7286862.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!