2023-06-15 css伪类before、after制作文字两边横线

<div class="box">测试</div>
···
 .box{
    color: #ccc;
    text-align: center;
    position: relative;

    &::after {
      position: absolute;
      left: 24rpx;
      top: 52%;
      content: '';
      width: calc(50% - 100rpx);
      height: 1rpx;
      background-color: #ccc;
    }

    &::before {
      position: absolute;
      right: 24rpx;
      top: 52%;
      content: '';
      width: calc(50% - 100rpx);
      height: 1rpx;
      background-color: #ccc;
    }
  }

emm，我这里用了sass。