移动端项目中 @2x 图 和 @3x 图 的使用

移动端开发过程中，因为手机的dpr(设备像素比不同)，我们需要根据dpr来修改图标的大小:

如果设备像素大于等于2，则用2倍图

在stylus中定义一个方法：

   bg-image($url)
   /\* 如果设备像素大于等于2，则用2倍图 \*/
      background-image: url($url + "@2x.png") 
      background-repeat no-repeat
      @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3)
       /\* 如果设备像素大于等于3，则用2倍图 \*/
        background-image: url($url + "@3x.png")
        background-repeat no-repeat
        
        

-webkit-min-device-pixel-ratio: 3是指当时显示屏最小的色倍为3倍的