文章目录
- 1 概述
- 1.1 目的
- 1.2 标签：block、extends
- 1.3 目录结构
- 2 templates 目录
- 2.1 base.html：父页面
- 2.2 login.html：子页面
- 3 其它代码
- 3.1 settings.py
- 3.2 views.py
- 3.3 urls.py
1 概述
1.1 目的
- 模板继承 和 类继承 的目的是一样的，都是为了提高代码的复用
1.2 标签：block、extends
# 父 Html 中，block：定义语句块，供 子页面使用
{% block xx %}{% endblock %}# 子 Html 中，extends：继承父页面
{% extends "xx.html" %}
1.3 目录结构
2 templates 目录
2.1 base.html：父页面
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>{% block title %} 基础页面 {% endblock %}</title>{% block css %} {% endblock %}
</head>
<body><a href="https://www.baidu.com/"> 百度一下 </a>{% block content %} {% endblock %}{% block js %} {% endblock %}
</body>
</html>
2.2 login.html：子页面
{% extends "base.html" %}{% block title %}登录首页
{% endblock %}{% block css %}<style>p {color: red}</style>
{% endblock %}{% block content %}<p>姓名：<input type="text" placeholder="姓名"></p><p>密码：<input type="text" placeholder="密码"></p>
{% endblock %}{% block js %}<script>alert('欢迎登录')</script>
{% endblock %}
登录效果：
3 其它代码
3.1 settings.py
TEMPLATES = [{'BACKEND': 'django.template.backends.django.DjangoTemplates',# 模板的位置'DIRS': [os.path.join(BASE_DIR, 'templates')],'APP_DIRS': True,'OPTIONS': {'context_processors': ['django.template.context_processors.debug','django.template.context_processors.request','django.contrib.auth.context_processors.auth','django.contrib.messages.context_processors.messages',],},},
]
3.2 views.py
from django.shortcuts import render, HttpResponse, redirectdef login(request):return render(request, "login.html")
3.3 urls.py
from django.urls import pathfrom app01 import viewsurlpatterns = [path('login/', views.login),
]
![[ABC294Ex] K-Coloring](http://pic.xiahunao.cn/[ABC294Ex] K-Coloring)
)
)
