css 伪类实现 中间文字 两边画横线

效果：  我是文字---------------------------------------

代码实现了右边画线，左边画线同理。

<div class="hour-box">
       <p class="hour-line">我是文字</p>
 </div>

.hour-box {
          position: relative;
          .hour-line {
            &:after {
              content: '';
              height: 1px;
              position: absolute;
              border-top: 1px dashed '#333';
              width: calc(100% - 50px);
              top: 50%;
            }
          }
        }