css实现细边框

在实际开发中都是通过border来设置边框，但是会发现就算是最小的边框也还是有点宽，因此通过一下两个方法可以实现细边框 。

 

细边框：

 

border设置的边框

 

 1.在标签中实现

.light-line {
    width:200%;
    height:1rpx;
    transform-origin:0 0;
    transform:scale(0.5);
    background-color:#eee;
}

 

 2.在  ::after 中实现

.item::after{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width:200%;
  height: 200%;
  border: 1rpx solid #ddd;
  border-radius: 10rpx;
  transform: scale(.5);
  transform-origin: 0 0;
  box-sizing: border-box;
}

 

 

未完待续：https://www.daqianduan.com/5935.html