html - CSS中h1下的双下划线

Question

我想让我的 h1 在它下面有两个边框。一个是厚的，只有文本的宽度，另一个是更薄的，整个容器的宽度。

像这样：

我怎样才能用 CSS 做到这一点？

我已经尝试了很多东西，看起来很容易，但我无法弄清楚！我也找不到任何其他类似的论坛或帖子。

Answer 1

如果您可以将您的 HTML 更改为：

<h1><span>Advertiser Name &mdash; Manage Campaigns</span></h1>

然后你可以使用这个 CSS：

h1 {border-bottom:2px solid black; padding-bttom:5px}
h1>span {border-bottom:5px solid black}

示范

Answer 2

您必须有两个嵌套<div>的 s （或<span>或<h1>取决于上下文） - 一个带有粗边框，一个带有细边框。