Django Bootstrap开发笔记02 - 模板

一、创建应用

1.基于mysite 项目下创建名为personal的应用

python manage.py startapp personal

2.修改mysite/settings.py中的INSTALLED_APPS列表

INSTALLED_APPS = [
    'polls',
    'personal',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',4
    'django.contrib.staticfiles',
]

3.修改mysite/personal/views.py视图,使用render()方法调用personal/home.html网页

from django.shortcuts import render

def index(request):
    return render(request, 'personal/home.html')

4.在mysite/personal/文件夹下创建urls.py文件来管理路由,添加内容入下

from django.conf.urls import url, include
from . import views

urlpatterns = [
    url(r'^$', views.index, name='index')
]

5.修改mysite/mysite/urls.py文件来管理路由,内容入下

from django.contrib import admin
from django.urls import path, include
from django.conf.urls import url, include

urlpatterns = [
    url('admin/', admin.site.urls),
    # '^s'表示为根目录
    url('^$', include('personal.urls'))
]

二、添加模板

1.在mysite/personal/文件夹下创建templates文件夹,用于存放应用程序模板
2.在mysite/personal/templates/文件夹下创建personal文件夹,用于存放名为personal的应用程序的模板内容
3.创建header.html模板

<!DOCTYPE html>
<html lang="en">
<head>
<title>Harrison Kinsley</title>
</head>
<body class="body" style="background-color:#f6f6f6">
    <div>
        {% block content %}
        {% endblock %}
    </div>
</body>
</html>

4.创建home.html其内容是继承header.html,代码如下:

{% extends "personal/header.html" %}
{% block content %}
<p>Hey! Welcome to my website</p>
{% endblock %}

三、运行

1.使用命令行进入项目根目录,然后输入以下代码运行服务器:

python manage.py runserver

2.在浏览器输入http://127.0.0.1:8000/运行结果如下所示:

Hey! Welcome to my website

四、扩展

1.在/templates/personal文件夹下创建includes文件夹
2.创建新建的文件下添加htmlsnippet.html文件,内容入下:

{% block content %}
<p>Look at me, I am include.</p>
{% endblock %}

3.修改home.html,在其内容里添加一个模板内容

{% extends "personal/header.html" %}
{% block content %}
<p>Hey! Welcome to my website</p>
{% include "personal/includes/htmlsnippet.html" %}
{% endblock %}

4.启动服务器,在浏览器输入http://127.0.0.1:8000/
5.运行结果如下

Hey! Welcome to my website
Look at me, I am include.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值