📅 最后修改于: 2023-12-03 15:30:29.721000 🧑 作者: Mango
在 Django 中，可以通过使用 CSS 来设置页面的样式。
CSS（层叠样式表）用于描述网页的展示方式及样式，通过使用 CSS，可以设置页面中的文字、字体、颜色、背景等元素的样式，使页面更加美观、易读。
使用 CSS 在 Django 中设置页面的样式，有以下几个步骤：
在 Django 项目中，可以通过创建一个名为 static 的文件夹来存放静态资源文件（如 CSS、JS、图片等）。在项目的根目录下创建一个名为 static 的文件夹，并在 settings.py 中进行相关配置。
# settings.py
...
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static'),
]
...
上述配置中，STATIC_URL 用于设置静态文件的 URL，即在 HTML 中引用的路径；STATICFILES_DIRS 则用于设置静态文件的存放路径。
在 static 文件夹中创建一个名为 css 的文件夹，用于存放 CSS 文件。在该文件夹中创建一个名为 style.css 的文件，编写页面的样式。
/* static/css/style.css */
body {
background-color: #f5f5f5;
}
h1 {
font-size: 2em;
color: #333;
}
上述 CSS 代码设置了页面的背景颜色和标题的样式。
在 HTML 中引用 CSS 文件，可以通过在 <head> 标签中添加一个 <link> 元素来实现。
<!-- templates/base.html -->
<!DOCTYPE html>
<html>
<head>
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" href="{% static 'css/style.css' %}">
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>
上述 HTML 代码中，通过使用 {% static %} 模板标签，可以动态生成静态文件的 URL，以便在 HTML 中正确引用 CSS 文件。
在 Django 中，可以通过创建基础模板，并在其他页面中继承基础模板的方式来提高开发效率。
<!-- templates/home.html -->
{% extends 'base.html' %}
{% block title %}Home{% endblock %}
{% block content %}
<h1>Welcome to my homepage</h1>
<p>This is a sample page.</p>
{% endblock %}
在上述 HTML 代码中，通过 {% extends %} 模板标签继承了基础模板 base.html，并在 {% block content %} 中添加了页面的主要内容。
通过使用 CSS，在 Django 中设置页面的样式非常简单，只需要按照以上几个步骤即可。在实际开发中，建议尽可能地使用 CSS 来美化页面，使页面更具吸引力。