如何在文本下面的两行下划线

Question

我有一个需要下划线的文字，但我希望下划线低于带有一些空格的文字

我有一张图片来展示我需要做什么

这是我试过的代码

的index.html

<div class="line">
<p class="text-center"> <u> Offerings </u> </p>
</div>

Answer 1

请勿使用下划线标记，而是使用底部边框，如下所示：

＆＃13;

＆＃13;

.underline {border-bottom: 1px solid red;}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="line text-center">
  <span class="underline"> Offerings </p>
</div>

＆＃13;

＆＃13;

＆＃13;