HTML文档不使用外部CSS样式表

时间:2019-07-16 03:57:19

标签: html css django

我开始学习CSS,并尝试实现外部样式表后,发现无法更改html文档的颜色。我正在使用Visual Studio Code,而我的html模板正在使用Django继承。

我尝试仔细检查所有内容是否已保存,检查了href的拼写,甚至重新启动了VSC。到目前为止,什么都没有。

这是基本的html表

<!DOCTYPE html>
<html lang="en">
    <head>
      <meta charset="utf-8">
        {% block style %}
        {% endblock %}
     <title>
         {% block title %}
         {% endblock %}
     </title>
</head>
<body>
  {% block content %}
  {% endblock %}
</body>

</html>

以下是应使用样式的html工作表:

{% extends 'student_view_base.html' %}


{% block title %}
    Socrates Home Page
{% endblock %}

{% block style %}
<link rel="stylesheet" type="text/css" 
 href="css/sidebar.css">    
{% endblock %}


{% block content %}
    <h1>Socrates Home Page</h1>
    <div>
        <a href="{% url 'login' %}">Login</a>
    </div>
    <a href="{% url 'admin:index' %}">Admin Login</a>
{% endblock %}

这是CSS工作表:

h1{
    color: blue;
}

您可以说,对于Web开发人员来说,我通常是个新手,这主要是为了进行实验并确保我可以正确实现它。

据我所知,h1标签的文本应该变成蓝色。目前它仍然是黑色的。

编辑:我可以确认href链接到正确的文档,单击Ctrl可以将我带到正确的文档。

1 个答案:

答案 0 :(得分:2)

使用django时,最好将html代码放在模板上,而将CSS放在静态上。如下所示,在您的项目上创建模板和静态文件夹。 enter image description here

然后在TEMPLATES中编辑settings.py 'DIRS': [os.path.join(BASE_DIR, 'templates')]。还将以下代码添加到您的settings.py中:

STATIC_URL = '/static/'

STATIC_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]

STATIC_ROOT = os.path.join(BASE_DIR, 'static')


MEDIA_URL = '/media/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

你应该很好。