css 移動端 border 1px

帶圓角的邊框

border-radius: 5px;
box-shadow: 0 0 1px 0 #a09e9e;

單邊框

height:1px;
transform: scaleY(0.5);
transform-origin:0 0;
overflow: hidden;
background: #000;

多邊框

.border{
  position: relative;
  height: 40px;
  &::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 200%;
    height: 200%;
    border: 1px solid red;
    height: 200%;
    transform-origin: 0 0;
    transform: scale(.5);
  }
}

多邊框一邊

.borderBottom{
  position: relative;
  &::after{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    border-bottom: 1px solid green;
    transform: scaleY(.5);
    transform-origin: 0 0;
  }
}