Mur*_*udy 11 python jinja2 flask
我想在每个页面上显示一个导航栏.在PHP中,我会编写导航栏,然后将其包含在其他页面上.我试图将导航栏模板包含或扩展到其他模板中,但它不起作用.它只输出"这是主页".如何在每个模板中正确包含导航栏？
layout.html
<!doctype html>
<html>
<body>
{% block navbar %}
<style>
body {
margin: 0;
padding: 0;
}
div{
background: #333;
color: #f9f9f9;
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
}
</style>
<div>NAVBAR</div>
{% endblock %}
{% block content %}
{% endblock %}
</body>
</html>
index.html
This is the home page.
{% extends "layout.html" %}
{% block navbar %} {% endblock %}
{% block content %}
<h1>This is the homepage!</h1>
{% endblock %}
lor*_*. j 11
您可以在每个页面中包含导航栏.
nav.html
<style>
body {
margin: 0;
padding: 0;
}
div{
background: #333;
color: #f9f9f9;
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
}
</style>
<div>NAVBAR</div>
layout.html:注意 {% include 'nav.html' %}
<!doctype html>
<html>
<body>
{% include 'nav.html' %}
{% block content %}
{% endblock %}
</body>
</html>
index.html
{% extends "layout.html" %}
{% block content %}
<h1>This is the homepage!</h1>
{% endblock %}
有时候,这是设计网页的好方法.你打破了页面,例如:head.html,nav.html,footer.html ...你可以将它们包含在layout.html中以使用它们.
创建一个基本模板,其中包含所有页面通用的布局和导航.然后扩展此模板以创建实际页面.将块添加到基本模板,可以在其他模板中覆盖.
base.html
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>{% block title %} - My Site</title>
</head>
<body>
<div>Navbar</div>
{% block content %}{% endblock %}
</body>
</html>
index.html
{% extends 'base.html' %}
{% block content %}
<h3>{% block title %}Home{% endblock %}</h3>
<p>Hello, World!</p>
{% endblock %}
请注意,导航栏仅在基本模板中定义.它不需要块,子模板中的内容将在其后替换.
您可以使用类似的技术来控制导航栏中突出显示的项目.
| 归档时间： |
|
| 查看次数： |
9210 次 |
| 最近记录： |