H5开发1像素问题的解决

1像素的渐变线，做成背景放到页面中，在手机端，线变成2像素。因为手机的DP的机制问题，

解决办法也很简单，背景做成2像素的就好了嘛！1像素线，1像素白底。

或者CSS的after

.bar:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    right: auto;
    top: auto;
    height: 1px;
    width: 100%;
    background-color: #e7e7e7;
    display: block;
    z-index: 15;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%
}

@media only screen and (-webkit-min-device-pixel-ratio:2) {
    .bar:after {
        -webkit-transform: scaleY(.5);
        transform: scaleY(.5)
    }
}

@media only screen and (-webkit-min-device-pixel-ratio:3) {
    .bar:after {
        -webkit-transform: scaleY(.33);
        transform: scaleY(.33)
    }
}