css中标题的下划线

CSS中标题的下划线是一个重要的视觉元素，可以让读者快速地浏览页面并找到他们寻找的内容。下面是一些常用的下划线样式代码。

/*一条实线下划线*/
h1 {
  border-bottom: 1px solid black;
}
/*一条虚线下划线*/
h2 {
  border-bottom: 1px dashed black;
}
/*一条点线下划线*/
h3 {
  border-bottom: 1px dotted black;
}
/*两条实线下划线*/
h4 {
  border-bottom: 3px double black;
} 

如果你想要定制自己的下划线样式，可以使用CSS的::after伪元素来实现。

h1::after {
  content: "";
  display: block;
  width: 50%;
  height: 1px;
  margin-top: 5px;
  background-color: black;
} 

上面的代码会在<h1>标签后面添加一个宽度为50%、高度为1px的黑色块，从而形成一个下划线。你可以通过调整width和margin-top来修改下划线的长度和位置。

总的来说，下划线是一个有用的页面元素，可以让用户更快地找到他们想要的信息。通过使用CSS来改变下划线的外观，我们可以进一步提高页面的可读性和可访问性。