为什么在Bootstrap中边框类的color属性上有重要的覆盖? [英] Why is there an important override on the border classes's color property in Bootstrap?

问题描述

在导航中应用边框时，我认为最好使用

When applying a border to my navigation, I thought it would be best practice to make use of the Bootstrap .border class.

但是查看使用该类渲染的代码，它似乎在.border类内部的border属性的颜色值上使用！important值.在这种情况下，我正在使用.border-bottom类在导航的底部添加边框.

But looking into the code that will render using this class, it appears to be using an !important value on the color value of the border property inside the .border class. In this case I was making use of the .border-bottom class to add a border to the bottom of my navigation.

这是使用类时呈现的代码的样子:

This is what the rendered code would look like when using the class:

.border-bottom {
    border-bottom: 1px solid #dee2e6!important;
}

这意味着如果我要编辑此边框类的颜色，则需要用另一个!important值覆盖该颜色值.我在想，为什么这样做呢?

This means if I want to edit the color of this border class, I am required to override the color value with another !important value. I was wondering, why is this done like this?

我是否仍应使用.border类来实现此目的，并在自定义样式表中使用另一个!important进行覆盖?还是.border类不是要达到我要达到的目的(例如，我想要一个红色边框，而不是白色或灰色的颜色)?

Should I still use the .border class for achieving this purpose and override using another !important in a custom stylehsheet? Or is the .border class not meant for achieving the purpose I am trying to achieve (e.g. I would like a red border instead of whatever white/grey-ish color this is)?

推荐答案

使用!important被认为是实用程序/帮助程序类可以接受的，并且Bootstrap的作者具有

Using !important is considered to be acceptable for utility/helper classes, and Bootstrap's authors have chosen to use !important on all of the Bootstrap 4 Utility classes.

这意味着 Border Color实用程序类也将使用!important，并且由于它们遵循CSS文件中的其他Border类，因此颜色上的!important将具有优先权(

This means that the Border Color utility classes also use !important, and since they follow the other Border classes in CSS file, the !important on the color will take precedence (Example).

如果您想定义自己的自定义边框颜色，则正如您所说的，您将需要使用!important.

If you want to define your own custom border color, then as you said, you will need to use !important.

这篇关于为什么在Bootstrap中边框类的color属性上有重要的覆盖?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！