Html 如何制作h3和<；人力资源>；内联，或如何设计后，标题将有一个水平线

如何使H3和HR内联，或者如何设计，在标题后面会有一条水平线，在我的情况下，只有HR进入下一行

<div class="row">
    <h3 class="col-md-4 col-sm-4 col-xs-6" data-i18n-key="Date.time.location"></h3>
        <hr class="col-md-8 col-sm-6 col-xs-4">
</div>

要内联这两个元素，请将

h3

和

hr

包装在单独的

div

元素中，并将它们的类上移到各自的

div

：

<div class="row">
    <div class="col-md-4 col-sm-6 col-xs-8">
        <h3 data-i18n-key="Date.time.location">Title</h3>
    </div>
    <div class="col-md-8 col-sm-6 col-xs-4">
        <hr>
    </div>
</div>

标题

您可以使用（display:inline block）属性使h3和hr内联，但我认为下面的示例将对您有所帮助

.drawine{
位置：相对位置；
}
.抽绳：之前{
内容：“；
位置：绝对位置；
顶部：50%；/*可以根据需要更改顶部：0、顶部：50%或底部：0的行位置*/
左：0；
宽度：100%；
高度：1px；
背景：#ccc；
}
.吊线跨度{
显示：内联块；
背景：#fff；
位置：相对位置；
右边填充：5px；/*文本和行之间的空格*/
}

你的文字会在这里