bootstrap-5 - bootstrap 5 有内置的水平线吗？

Question

我正在寻找有样式或彩色的水平线，最好是成功、主要、警告类。与彩色链接类似的概念。

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

我找到了一些参考Bootstrap v4 的工作解决方案。

就我而言：

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

它有效，但我想这不是最佳做法......

Answer 1

是的，它确实。重新启动的一部分，并且同时出现在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">

查看他们文档中的 Utility 类。