使用min-device-pixel-ratio媒体功能实现真正的1像素border

过完了一个愉快的年，开始陆陆续续的继续在家学移动端开发的知识。
关于设备像素比的知识，想必做过移动端开发的都有接触，这里就不介绍啦，万一有不懂的可以看张鑫旭大神的设备像素比devicePixelRatio简单介绍

由于设备像素比存在的原因，我们在处理设计图的一些边框时，对于1px的border，如果在代码里将其写死，可能在不同设备像素比的设备中，粗细不一样，尤其是在目前大多数设备像素比为2的设备中，过粗。

那么利用媒体查询和”min-device-pixel-ratio”就可以轻松的搞定，实现货真价实的1px border。

scss代码如下：

%border-1px{
    display: block;
    position:absolute;
    left: 0;
    width: 100%;
    content