移动 Web 1像素 问题

问题：一般在移动端，由于dpr（设备像素比）不为1，在PC端显示1像素的边框，在移动端其实显示为2px。
解决这个问题，主要思想是：使用伪元素设置1px的边框，然后使用 transform:scale，对边框进行缩放（scaleY）。

// 上边框
:before
    content ""
    position absolute
    top 0
    left 0
    right 0
    height 1px
    border-top 1px solid e5e5e5
    color #e5e5e5
    -webkit-transform-origin 0 0
    transform-origin 0 0
    -webkit-transform scaleY(0.5)
    transform scaleY(0.5)
    z-index 2

// 下边框 注意 transform-origin
&:after
    content ""
    position absolute
    bottom 0
    left 0
    right 0
    height 1px
    border-bottom 10px solid #e5e5e5
    color #e5e5e5
    -webkit-transform-origin 0 100%
    transform-origin 0 100%
    -webkit-transform scaleY(0.5)
    transform scaleY(0.5)
    z-index 2