Question

StackOverflow上有很多问题会问这个问题，但是我没有尝试过任何解决方案（即，将个人样式表粘贴在Bootstrap链接下方，使用bootstrap-override id为我的选择器添加更多权重，强制选择器）为我工作。我验证了我的CSS，因此没有遗漏的分号或类似的东西将其丢弃。而且，奇怪的是，！important属性不会覆盖样式。

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

所以，我认为base-generic.html和样式表之间的链接可能有问题。但是，注释掉链接显然对我页面的外观有很大的影响，因此样式表肯定可以正确链接。我不知道为什么我的CSS没有显示在页面上。我不认为这是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问题。也许是您的浏览器（服务人员软件）。右键单击检查，在软件上选择重新加载更新
或者只要您通过以下方式更改CSS文件，就可以重新加载页面： cmd + shift + R / ctr + shift + R

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

1 个答案: