纯css设置border-width

     常见的border设置一般都是直接类似1px solid #eee，但是在移动端上会发现这个1px的border显得很粗，如果直接设置0.5px的话，在ios里面的显示到还正常，不过有些安卓机不支持浮点数的的样式设置，这个时候就需要统一处理的，话不多说直接上代码吧，纯css设置border-width为0.5px，css代码如下：

      .input-wrap {
        position: relative;
      }
      .input-wrap::after{
        content: '';
        display: block;
        position:absolute;
        left: -50%; 
        bottom: 0;
        width: 200%;
        height: 1px;
        background: #ccc;
        transform:scale(0.5);
      }
      .jzt-form-item:last-child .input-wrap::after{
        height:0px;
      }

在伪类中用transform的scale进行缩放到一半，然后绝对定位到底部，同时最后一个input不需要下划线，效果图如下：

可以看到在调试模式下的安卓里也是显示0.5px的下划线了，真机测试也有效，而且如果还是觉得粗了的话，那就继续缩放比例，注意伪类里的width和缩放比例相乘刚好等于100%并且改变left的大小使下划线保持在正中间就行了。