css 将其他样式应用到继承的Django模板

在我的Django项目中，我设置了一个带有一组CSS样式的基本HTML模板（base.html）。这个基本模板被我项目中的其他几个模板继承。
我面临的挑战是，这些继承的模板中的一些需要特定于每个模板的额外样式。当我试图在**base.html中包含所有样式时，我发现它不能无缝地用于具有独特样式需求的模板。
在使用base.html**中定义的通用样式的同时，将额外的样式应用到单个模板的推荐方法是什么？是否有最佳实践或Django约定来有效管理此类场景？
我很感激任何关于如何构建我的模板和样式以实现整个项目内聚设计的见解或建议。
我最初试图合并base.html文件中的所有样式，希望它们能无缝地应用于所有模板。然而，这种方法并没有像预期的那样工作。单个模板的附加样式没有被正确应用。

假设你下面的优雅项目结构是这样的，你的静态文件夹显然是你的css文件代码所在的地方。

.
├── .dockerignore
├── Dockerfile
├── entrypoint.sh
├── requirements.txt
├── src
|   ├── manage.py
|   └── myproj
|       ├── __init__.py
|       ├── asgi.py
|       ├── settings.py
|       ├── urls.py
|       └── wsgi.py
|── venv

├── templates
    |
    ├──base.html
        
    └── registration
           |
            ── login.html
           myproj
|          ├── __products.html
|      
        
├── static
    |
    ├──CSS 
         ├── mycss.css
    └── JS
         ├── product.js

字符串
步骤：
1.然后，您必须在项目结构的settings.py of myproj which lives in src中配置STATIC DIR文件。
这是如何做到这一点：

STATIC_ROOT = BASE_DIR / 'static'

STATIC_URL = 'static/'

#Add this in your settings.py file:
STATICFILES_DIRS = [
    BASE_DIR / 'staticfiles'
]

型
1.使用BASE_DIR/templates查找在设置中配置的templates文件夹中创建base.html文件。
确保您的模板具有类似的结束块，如下所示：

{% load static %}
<!DOCTYPE html>
<html>
<head>
  <title>{% block title %}{% endblock %}</title>
  <link rel="stylesheet" href="{% static 'CSS/mycss.css' %}">  
</head>
<body>

{% block content %}
{% endblock %}

</body>
</html>

型
3.然后你现在可以扩展你的css到任何你想要的模板，而不需要在你的任何HTML中，比如products.html，就像这样：

{% extends "master.html" %}

{% block title %}
 List of all members
{% endblock %}

{% block content %}
  <div class="mycard">
    <h1 class="heading-color">I love Django</h1>
    <ul>

      {% comments %}Your other django code blocks from your view here {%comments %}
    </ul>
  </div>
{% endblock %}

型
1.在你的mycss.css fole of CSS folder中，你现在可以编写任何你想要的CSS代码，这些代码将动态地出现在你应用它来继承这些代码的任何页面中。
Mycss输入：

heading-color {
  background-color: lightblue;
}

型
例如，您的login.html和products.html可以继承您在Web上呈现页面时编写的代码的背景。
附言：如果你是在生产环境中，不要忘记经常运行python manage.py collectstatic命令，让你新创建的CSS样式动态呈现在你想要使用的静态库中，比如AWS，Nginx等
祝你好运

css 将其他样式应用到继承的Django模板

1条答案

相关问题

热门标签

最新问答