html - 不确定 HTML 是否正在使用 CSS 文件，因为对 CSS 文件所做的更改不会显示在网页上。我该怎么办？

Question

我的任务是针对“Beta:空床位”和“Beta:Hall Roster With Empty Beds”报告发出警报。我必须将警报放在页面顶部。我希望它居中并且不占据页面的整个宽度。

插入内联样式有效，但我不确定它是否正在读取 CSS 文件。考虑到这是一份工作，我无法真正移动文件本身，而且我 99% 确定它位于一个好的文件位置，因为我的同事/老板已经在那里。

HTML代码:

{% extends 'reports_templates/base.html' %}
{% load static from staticfiles %}

{% block extra-head %}
<link rel="stylesheet" type="text/css" href="{% static 'datatables/media/css/jquery.dataTables.min.css' %}">
<link rel='stylesheet' type='text/css' href="{% static 'css/empty_bedspaces.css' %}">
{% endblock %}

{% block title %}
<title>Empty Bed Spaces</title>
{% endblock %}

{% block content %}
<div class="alert alert-danger" id="alert">
  <strong>Note:</strong> Some of the rooms below may not be available for assignment.
</div>

CSS 代码:

.container div {
  margin: 1%;
}

#specific-table tr th {
  border-bottom: 1px solid #111;
}

th.title {
  text-align: center !important;
}

.alert-danger {
    font-size: 72px;
}

如果我这样做:

<div class="alert alert-danger" style="margin: 45%" >
  <strong>Note:</strong> Some of the rooms below may not be available for assignment.
</div>

它会占用足够的页面空间。另外，请记住这几乎不是所有代码。我不想粘贴一个大文件。

Here is a picture of how it looks so far with just the alert div.

Answer 1

尝试清除缓存，大多数浏览器:CTRL+SHIFT+R。在开发时，我还建议在您的开发面板中禁用本地缓存。在 Chrome 中，它将是 F12 > 网络选项卡 > 检查禁用缓存。您可能还需要重新启动浏览器以强制执行更改。