border设置1px在手机上看起来不止1像素怎么解决啊？

1px边框在2倍屏上为2 “占位”，在3倍屏上为3 “占位”，但是就是想要达到设计图上的1px “占位”效果。

.content h1:after,

.content h2:after {

    border-top: 1px solid #bfbfbf;

    content: ' ';

    display: block;

    width: 100%;

    position: absolute;

    left: 0;

    bottom: 0;

    -webkit-transform-origin: left bottom;

}

/* Retina 适配 */

@media only screen and (-webkit-min-device-pixel-ratio: 2.0),

only screen and (min--moz-device-pixel-ratio: 2.0),

only screen and (-o-min-device-pixel-ratio: 200/100),

only screen and (min-device-pixel-ratio: 2.0) {

    .content h1:after,

    .content h2:after {

        -webkit-transform: scaleY(0.5);

        transform: scaleY(0.5);

    }

}

/* 3倍屏适配 */

@media only screen and (-webkit-min-device-pixel-ratio: 2.5),

only screen and (min--moz-device-pixel-ratio: 2.5),

only screen and (-o-min-device-pixel-ratio: 250/100),

only screen and (min-device-pixel-ratio: 2.5) {

    .content h1:after,

    .content h2:after {

        -webkit-transform: scaleY(0.33333334);

        transform: scaleY(0.33333334);

    }

}

由于高清屏的特性，1px是有2*2个像素点渲染，border 1px在Retina屏下会渲染成2px的边框，实现方式有多种，有图片、阴影、缩放。