自定义 CSS 被 bootstrap.css.map 覆盖？答案

【问题标题】：Custom CSS overwritten by bootstrap.css.map?自定义 CSS 被 bootstrap.css.map 覆盖？
【发布时间】：2019-02-12 10:41:34
【问题描述】：

我正在使用 Bootstrap 4，我正在尝试在我的自定义 CSS 文件中为导航栏中的导航链接设置填充：

.nav-link {
padding: 0.15rem;

}

而且使用的样式是这样的：

如您所见，custom.css 无处可见。当前样式所在的 css 文件位于 bootstrap.css.map 中。

为什么它从 bootstrap.css.map 而不是我的自定义 CSS 文件中读取样式？我将所有样式捆绑在一起，首先加载 bootstrap.css，最后加载我的自定义 CSS。

【问题讨论】：

【解决方案1】：

您需要了解 css 中的特异性是如何计算的，这是一个简单的话题。

如果你想要一个快速的解决方案，你可以在你的 css 样式旁边使用 !important ：

td { height: 50px !important; }

【讨论】：

【解决方案2】：

对不起，我原来的答案是我查看了调试器的输出。

如果您需要覆盖。在我的一个项目中，我给周围的标签一个 id。

<ul id="myNavBar">

然后下面的 CSS 对我有用

#myNavBar .link-item {
  padding: 0.15rem;
}

【讨论】：