css标题文字和下划线重叠

 <view class="text">
        <text class="textCon">标题</text>
        <text class="borderText"></text>
  </view>

.text {
  font-size: 36rpx;
  color: rgba(51, 51, 51, 1);
  position: relative;
  display: inline-block;
}

.textCon {
  position: relative;
  z-index: 999;
}

.borderText {
  width: 100%;
  height: 10rpx;
  background: #1694cd;
  position: absolute;
  bottom: 0;
  z-index: 0;
  left: 0;
}

效果展示