Question

我已经在引导 CDN 下导入了我的自定义 CSS 文件，但它仍然没有被覆盖。 [这是检查元素的屏幕截图。][1]

<块引用>

导入 bootstrap 和 css

  <!-- Bootstrap -->
  <link
    rel="stylesheet"
    href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"
    integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
    crossorigin="anonymous"
  />
  <!--Custom CSS-->
  <link rel="stylesheet" type="text/css" href="{% static '/css/base.css' %}" />
  <link rel="stylesheet" type="text/css" href="{% static '/css/cart.css' %}" />

<块引用>

我的自定义样式（覆盖引导程序）

* {
  font-family: 'Poppins';
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

Answer 1

您的代码按预期工作：

* 的优先级低于 p（或任何选择器），因此 boostrap 代码会更重要。

文件的顺序仅在存在两个具有相同优先级的选择器时才重要。在这种情况下，最新加载的文件将获胜。

要解决此问题，请执行以下操作：

p {
margin: 0;
padding: 0;
}

然后你会看到你的代码正在应用。

Boostrap 样式不会被覆盖

1 个答案: