css移动端适配 1px边框的解决方案

.border{
  width: 100px;
  height: 100px;
  position: relative;
}
//加上媒体查询更严谨一些 dpr为2的设配才进行缩放，dpr为1的设备边框就是1px
@media screen and (-webkit-min-device-pixel-ratio:2) {
   .border::after{
     content: '';
     position: absolute;
     left: 0;
     top: 0;
     border: 1px solid #000;
     box-sizing: border-box;
     width: 100%;
     height: 100%;
     transform-origin: 0 0;
     transform: scale(0.5);
   }
}