Question

我正在尝试覆盖Page-down应用程序和django-crispy-forms生成的类。但是通过覆盖类期望的缩进无效。

base.html （最初）

...
<link rel='stylesheet' href='{% static "css/base.css" %}'>
<style>
{% block style %}{% endblock style %}
</style>
{% block head_extra %}{% endblock head_extra %}
...

base.css

h1 {
    color: #777777;
}

post_forms.html

{%extends "base.html" %}
{% load crispy_forms_tags %}
{% block head_extra %}
{{form.media}}
{% endblock head_extra %}
...

通过使用chrome中的inspect功能，我可以发现导致缩进的类

<div class="wmd-panel">
</div>

下面给出的代码CSS是自动生成的

.wmd-panel {
    margin-left: 25%;
    margin-right: 25%;
    width: 50%;
    min-width: 500px;
}

但是在对css / base.css进行更改之后，Chrome的样式标签中的base.css文件中没有名为wmd-panel的类。并且所做的更改不会反映在网页中。

base.css

h1 {
    color: #777777;
}

.wmd-panel{
    margin-right: 0px !important;
    margin-left: 0px !important;
}

这是Chrome检查样式标签中所期望的

.wmd-panel {
    margin-left: 0%;
    margin-right: 0%;
}

以上此类来自basic.css

Answer 1

您应该清理Chrome缓存并再次检查。有时它只是不更新代码，而您只是在查看旧的CSS，即使您对其进行了更改。

Settings>Advanced>ClearBrowsingData>

并删除所有缓存的图像和文件

Answer 2

您有{% load static %}吗？有时，您只是忘记了这一点。通常，您会在设置中错过STATIC_URL = '/static/'。

base.css是否无法导入到页面？

2 个答案: