>》>》>》>》

0.5px的线 + 0.5px边框

div{
width:100px;
height:100px;
position: relative;
     &::before{
            display: block;
            width: 100%;
            content: '';
            height:1px;
            background-color: rgba(52,56,75, 0.1);
            position: absolute;
            left: 0;
            bottom: 0;
            transform: scaleY(.5);
    }   
}

  0.5px 边框 (动态宽度)

 .buyed {
        height: 16 * $px;
        font-size: 10 * $px;
        text-align: center;
        line-height: 10 * $px;
        padding: 3 *$px 4 * $px;
        box-sizing: border-box;
        position: relative;
        &::before {
          content: '';
          position: absolute;
          width: 200%;
          height: 200%;
          top: 0;
          left: 0;
          border: 1px solid rgba(255,255,255,0.50);
          border-radius: 6 * $px;
          box-sizing: border-box;
          transform: scale(.5) translate(-50%, -50%);
        }
      }

 

posted @ 2022-01-07 15:15  大、锤  阅读(29)  评论(0编辑  收藏  举报