移动端1像素问题

关于移动端一像素问题,网上有很多文章给予了解决,在此我只说我一般采用的方法

首先也说明一下造成边框变粗的原因:

因为css中的1px并不等于移动设备的1px,这些由于不同的手机有不同的像素密度。在window对象中有一个devicePixelRatio属性,他可以反应css中的像素与设备的像素比。
devicePixelRatio的官方的定义为:设备物理像素和设备独立像素的比例,也就是 devicePixelRatio = 物理像素 / 独立像素。

1、伪元素解决

 
 
      
          
    Document
    
 
 

    

2、查询devicePixelRatio 改变缩放比例

 
 
 
      
          
    Document
    
 
 
    

来源:https://www.jianshu.com/p/7e63f5a32636

你可能感兴趣的:(移动端1像素问题)