html - 无法应用 CSS，可能是因为 Bootstrap

Question

StackOverflow 上有很多问题都在问这个问题，但我没有尝试过任何解决方案(即粘贴在 Bootstrap 链接下方的个人样式表，使用 bootstrap-override id 为我的选择器增加更多权重，强制选择器) 正在为我工​​作。我验证了我的 CSS，所以没有杂散的分号或类似的东西。另外，奇怪的是，!important 属性不会覆盖样式。

我正在使用 Django 构建一个站点。我的所有页面都是从我的“base_generic.html”文件扩展而来的，所有内容都链接到一个样式表。当我对样式表进行任何更改时，它不会反射(reflect)在 html 页面上。即使是与 HTML 选择器的 Bootstrap 无关的最基本的更改(例如更改字体大小或颜色)。

所以，我认为我的 base-generic.html 和我的样式表之间的链接可能存在问题。但是，注释掉链接显然会使我的页面外观发生巨大变化，因此样式表绝对是正确链接的。我不知道为什么我的 CSS 没有反射(reflect)在页面上。我认为这不是 Bootstrap 问题，因为将我的 p 选择器中的所有文本都设为绿色应该与 Bootstrap 没有任何关系，但我不排除这种可能性。知道发生了什么事吗？

编辑:我没有添加代码，因为它不多，但这是我所拥有的:

我的从 base-generic.html 扩展的 html 页面:

{% extends "base_generic.html" %}

{% block content %}

<h1><strong>{{room_name}}</strong></h1>

{% if room_name.status == 'g' %} <p>{{room_name}}'s status is <strong id="green-text">green</strong>.</p>{%elif room_name.status == 'y' %}<p>{{room_name}}'s status is <strong id="yellow-text">yellow</strong>.</p>{% elif room_name.status == 'r' %} <p>{{room_name}}'s status is <strong id="red-text">red</strong>.</p>{% endif %}

<p>{{room_name.details}}</p>

{% endblock content %}

还有我的 CSS:

nav {  background-color: #07407b;  }

#nav-title {  color: white;  }

body {
  font-family: 'Varela Round', sans-serif;
}

.container {  padding-top: 5.5em; }

.card { padding-top: 5.5em; }

h1 {
  padding-bottom: 1em;
  padding-top: 1em;
  font-size: 1.5em;
  text-align: center;
}

#last-row { padding-bottom: 5.5em;  }

.navbar-brand { font-size: 1.75em; }

h2 {
  font-size: 1.2em;
}

#green-text {
  color: green;
}

Answer 1

我认为这不是 Bootstrap 问题。也许是你的浏览器(Service Workers SW)。右键单击检查，继续您的 SW 并选择重新加载时更新
或者在您更改 CSS 文件时通过以下方式重新加载您的页面: cmd+shift+R/ctr+shift+R