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