django-模板之include标签（十五）

就是将一些常用的html代码分离出来，使其可以重复利用，减少代码量

index.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>{{title}}</title>

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

</head>

<body>

    {% include 'header.html'%}

    <div class="content">

        <h1>这是主界面</h1>

        <!--{% block content %}-->

        <!--{% endblock %}-->

    </div>

    {% include 'footer.html'%}

</body>

</html>

header.html

<div class="header">

    <ul>

        <li>index</li>

        <li>html</li>

        <li>css</li>

        <li>python</li>

        <li>php</li>

    </ul>

</div>

footer.html

<div class="footer">

    <ul>

        <li>index</li>

        <li>html</li>

        <li>css</li>

        <li>python</li>

        <li>php</li>

    </ul>

</div>

index.css

.header {

    height: 68px;

    background-color: fuchsia;;

}

.header li{

    float:left;

    display: inline;

    margin-left:10px;

    line-height: 60px;

    list-style:none;

    color:#ffffff;

    font-size: 28px;

}

.content{

    height:300px;

}

.footer{

    height:50px;

    background-color: thistle;

}

.footer li{

    float:left;

    display: inline;

    margin-left:10px;

    line-height: 60px;

    list-style:none;

    color:#ffffff;

    font-size: 28px;

}

具体效果：

巴特西

django-模板之include标签（十五）

最新文章

热门文章