Question

我一直在寻找一种方法来定义CSS标题属性，以便在标题文本上方几个像素处获得一条短的彩色线条。我不想要一个顶部边框，因为它一直延伸到整个页面。

各种边框，轮廓，背景和其他属性似乎无法指定长度，例如百分比或像素数。

用于创建独立分隔符的各种CSS技术似乎需要自己的代码块，例如：一个班级或身份证。

目前我正在使用内联块和背景颜色属性来创建一些类似于我之后的内容。但是，知道是否有一种方法可以创建相当于我自己选择的顶部边框的方式，这将是一件好事。

Answer 1

您可以简单地使用伪选择器。

＆＃13;

h1:before {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: 50px;
  background: red;
}

＆＃13;

<h1>Sample title</h1>

＆＃13;