css br 划线

在 CSS 中，<br> 标签是一个没有内容的标签，它可以在文本中插入一个分行符，使得文本在这个标签处分行。但是，在某些情况下，我们需要给文本添加一个横线，比如给网页中的标题添加下划线，这时我们可以使用 CSS 中的text-decoration属性来实现。

h1 {
  text-decoration: underline;
}

这样，会给所有的h1元素添加下划线效果。但是，如果我们只想给h1元素的最后一行添加下划线呢？这时就可以使用br标签和 CSS 结合起来，具体代码如下：

h1 {
  position: relative;
  display: inline-block; 
  /*将 h1 元素设为内联块状元素，使其可以设置 padding 和 border-bottom*/
  padding-bottom: 10px; 
  /*为 h1 元素的最后一行预留下划线的高度*/
}
h1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  border-bottom: solid 2px;
  /*设置下划线的样式*/
}

这样，我们就可以为h1元素的最后一行添加下划线了。注意，在使用br标签和 CSS 实现下划线的同时，我们也可以轻松地调整下划线的样式和位置，实现更佳的视觉效果。