Css 文本下方的边框底部

我有一个div块，我想在文本下方应用边框底部，而不是整个div块 div块是

#信息头{
字体大小：40px；
文本对齐：居中；
余量：100px 10px 10px 10px；
字体系列：Poiret One；
颜色：浅黄色；
边框底部：1px实心白烟；
}

找到我们

您可以将文本包装在类似

的内联元素中，并对其应用边框

HTML:

<div id="info-header">
  <span>some text here...</span>
</div>

#info-header span {
  border-bottom: 1px solid whitesmoke;
  display: inline-block;
  vertical-align: top;
}

注意：如果要应用块级属性，但保持其行为类似于内联元素，则可以使元素

内联块

。这样，您还可以控制

边框宽度

以及文本和边框线之间的距离

正文{
背景：绿色；
最小高度：100vh；
保证金：0；
}
#信息头{
字体大小：40px；
文本对齐：居中；
余量：100px 10px 10px 10px；
字体系列：Poiret One；
颜色：浅黄色；
}
#信息头跨度{
边框底部：1px实心白烟；
显示：内联块；
垂直对齐：顶部；
}

这里有一些文字。。。

添加css属性文本装饰：下划线

您应该使用文本装饰属性。 就你的情况而言：

文本装饰：下划线
您还可以通过“阅读关于”对上划线和划线使用文本装饰。您可以更改另一个
块的
显示值


html{
背景：浅灰色
}
#信息头{
字体大小：40px；
/*文本对齐：居中；
余量：100px 10px 10px 10px*/
显示：表格；/*缩小内容*/
页边距：10px自动；/*页边距：自动代替此块的文本对齐*/
字体系列：Poiret One；
颜色：浅黄色；
边框底部：1px实心白烟；
}

找到我们
给
一个固定宽度并给它一个{margin:0 auto}用于居中


正文{
背景：131418；
文本对齐：居中；
}
#信息头{
字体大小：40px；
保证金：0自动；
宽度：300px；
颜色：浅黄色；
边框底部：1px实心白烟；
}
这是一个不错的标题
请同时提供HTML代码。为什么不使用文本装饰：下划线css