CSS - 1px

在移动端开发时，设计图1px的边框显示在手机屏幕上时，1px会显的很粗，与设计图不相符，设置0.5px效果也没有变化

解决方法：使用伪类，设置高度为1px，再缩小0.5倍

通过transform: scaleY(0.5)对height: 1px进行缩0.5倍缩放

.border1px {
 position: relative;
 border: none;
}

.border1px:after {
 display: block;
 content: '';
 position: absolute; 
 bottom: 0;
 left: 0;
 background: #E1E1E1; 
 width: 100%; 
 height: 1px;
 transform: scaleY(0.5);
}

如果是对width: 1px进行缩小，则换成transform: scaleX(0.5)