zoukankan      html  css  js  c++  java
  • Blog_Django(五):blog的页面布局:模板、过滤器

    本次blog系统的全端使用了django模板,而不是jinjia2。

    为了让整个网站系统具有整齐的布局,同时页面的各个部分具有可复用性。一般从如下几点考虑:

    1、将index页面拆分几块。各个页面都继承自base。可变部分可以定义在block中,公用模板可以使用include

    2、base的布局如下:

    {% load staticfiles %}
    <!doctype html>
    <html>
    <head>
        <meta charset="utf-8">
        <title>{{ site_name }}</title>
        <meta name="keywords" content="{{ site_name }}"/>
        <meta name="description" content="{{ site_desc }}"/>
        <link href='{% static "base/css/base.css" %}' rel="stylesheet">
        <link href='{% static "base/css/index.css" %}' rel="stylesheet">
        {% block customer_css %}{% endblock %}
        <script type="text/javascript" src='{% static "jquery/jquery-3.1.1.js" %}'></script>
        <script type="text/javascript" src='{% static "base/js/sliders.js" %}'></script>
        {% block customer_js %}{% endblock %}
    </head>
    <body>
    <header>
        {% include "main/header.html" %}
    </header>
    <article>
        <div class="l_box f_l">
            {% include "main/ad.html" %}
            <!-- banner代码 结束 -->
            {% block content %}{% endblock %}
        </div>
        {% include "main/right.html" %}
    </article>
    <footer>
        {% include "main/footer.html" %}
    </footer>
    </body>
    </html>
    base.html

    其他各个页面继承自base.html

    {% extends "main/base.html" %}

    3、注意使用{% load staticfiles %}来引入静态文件。

    下一步,我们将在首页显示所有的文章,同时分页显示。

  • 相关阅读:
    2019.6.28 校内测试 T3 【音乐会】道路千万条
    2019.6.28 校内测试 T2 【音乐会】二重变革
    2019.6.28 校内测试 T1 Jelly的难题1
    CentOS7:ifconfig command not found解决和netstat -an
    centos系统查看本机IP地址
    centos 端口iptables配置
    centos -bash: netstat: command not found
    Centos 安装 NodeJS
    Go语言-变量和常量
    go get
  • 原文地址:https://www.cnblogs.com/yangshl/p/6505393.html
Copyright © 2011-2022 走看看