bootstrap 5 是否内置水平线？

Question

我正在寻找带样式或彩色的水平线，最好带有成功、主要、警告类。类似于 colored links.

的概念

我在 Bootstrap 的网站上找不到这个主题。

我找到了一些参考

的可行解决方案

就我而言：

<div class="divider py-1 bg-success"></div>

它有效，但我想这不是最佳实践...

Answer 1

是的。 Reboot 的一部分，并且出现在 Bootstrap-reboot.css 和 Bootstrap.css 中。它将 <hr> 定义为：

hr {
  margin: 1rem 0;
  color: inherit;
  background-color: currentColor;
  border: 0;
  opacity: 0.25;
}

此外，Bootstrap 5 已将其 UI 的大部分控制权移至实用程序类...这让您可以更充分地控制 UI .例如，如果您想要“危险”/红色 <hr>，您可以使用：

<hr class="bg-danger border-2 border-top border-danger">

查看 their docs 中的实用工具类。

Does bootstrap 5 have a built-in horizontal line?