Django学习路29_css样式渲染 h3 标签

在 static 静态文件夹下创建 css 文件夹 home.css 
此时 home.css 路径是 'static/css/home.css'

在 对应的 home.html 文件中添加 css 样式

{% block ext_css %}
{#    <link rel="stylesheet" href="/static/css/home.css">#}
{#    导入样式#}
    <link rel="stylesheet" href="{% static 'css/home.css' %}"
{#       使用相对路径#}
{% endblock %}

注:
导入方式:
 <link rel="stylesheet" href="/static/css/home.css">
使用绝对路径,如果路径修改,则很容易出错

<link rel="stylesheet" href="{% static 'css/home.css' %}"
使用相对路径,在使用之前,要先在项目的 settings 中添加

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'static'),
]
通知项目,存在该目录

home.html 内容

{% extends 'base.html' %}
{#继承 base.html #}
{% load static %}
{% block header %}
<h2> header 模块 第一次继承 .html 文件</h2>
{% endblock %}

{% block footer %}
{% include 'footer.html' %}

{% endblock %}

{% block ext_css %}
{#    <link rel="stylesheet" href="/static/css/home.css">#}
{#    导入样式#}
    <link rel="stylesheet" href="{% static 'css/home.css' %}"
{#       使用相对路径#}
{% endblock %}

home.css 内容
标签名{
  属性:值;    
}

h3{
    color:green;
}

本次使用的是 footer.html  继承了 home.html 的子类

footer.html 内容

{% extends 'home.html' %}

{% block footer %}

    <h3> 继承了 子类 home 的 类,显示块为 footer </h3>
{% endblock %}


{% block header %}
    {{ block.super }}
    继承了 子类 home 的 类,显示块为 header
{% endblock %}


{% block content %}
    <h3>做一件事,就把这件事做好</h3>

{% endblock %}

在 urls 中注册

 url(r'footer',views.footer)

在 views 中实现

def footer(request):

    return render(request,'footer.html',context={'title':'footer'})

---

 

 

---

注:
在 settings 中的 
DEBUG = True

当 DEBUG 为 False 时,会发生界面找不到

 

 

---

核心语句写法:

导入:
<link rel = "stylesheet" href = "{%static '相对路径'%}">

 <link rel="stylesheet" href="{% static 'css/home.css' %}"


继承:
{% extends '文件名.html'%}

{% extends 'base.html' %}
{% extends 'home.html' %}

css 样式:
标签名{
  属性:值;
}

h3{
    color:green;
}

---

千万要进行注册

STATIC_URL = '/static/'

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

---

2020-05-16