文字两侧加横线代码

文字两侧加横线

html代码

<div class="recommend_group_top">
      <span class="recommend_group_top_txt" >全民拼团</span>
</div>

css代码

.reason_txt{
  font-size: 32rpx;
  color: #333333;
  display: table;
  width: auto;
  white-space: nowrap;
  border-spacing: 0.5rem 0;
  margin-left: 28rpx;
  margin-right: 28rpx;
}
.reason_txt::before,.reason_txt::after{
  display: table-cell;
  content: "";
  width: 50%;
  background: linear-gradient(#D8D8D8, #D8D8D8) repeat-x center;
  background-size: 0.1rem 0.1rem;
}

页面效果

@cc