0.5px的宽度的边框

方法1： 

.border {
    position: relative;
}
 
.border:before {
    content: "";/* 注意这里为双引号 */
    position: absolute; left:0; top:0;
    width: 200%;
    height: 200%;
    border: 1px solid #ff0000;
    border-radius:5px;/* 也可以设置圆角 */
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(0.5, 0.5);
    -ms-transform: scale(0.5, 0.5);
    -o-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

 

方法二：

.point5 {
   position: relative;
}
.point5:after {
   position: absolute;
   content: '';
   width: 100%;
   left: 0;
   bottom: 0;
   height: 1px;
   background-color: #dddddd;
   -webkit-transform: scale(1,.5);
   transform: scale(1,.5);
   -webkit-transform-origin: center bottom;
   transform-origin: center bottom}