Question

我想使用基本模板，然后扩展部分视图。 extends无法正常工作，因为它根本没有显示基本标记。

base.html文件

<div class="container">
    {% block content %}
    {% endblock %}
</div>

_hello.html

    {% extends 'base.html' %}
   {% block content %}
    <div class="container">
        <div class="row">
            <div class="col-md-12 text-center"><h2>Survey About Computer Programming</h2></div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <h3>Programming</h3>
                <table class="table table-bordered table-striped table-responsive">
                    <thead>
                        <tr align="center">
                            <th>Main</th>
                            <th class="text-center">Option1</th>
                            <th class="text-center">Option2</th>
                            <th class="text-center">Option3</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Do you love Programming?</td>
                            <td class="text-center"><input type="radio" class=""></td>
                            <td class="text-center"><input type="radio" class=""></td>
                            <td class="text-center"><input type="radio" class=""></td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>

    </div>
    <script src="/static/survey/js/plugin.js"></script>
 {% endblock %}

Answer 1

您必须将代码放在块内容中。扩展模板会覆盖基本模板中的块。

<div class="container">
    {% block content %}
    {% endblock %}
</div>
    {% block js_bottom %}
    {% endblock %}

_hello.html

{% extends 'base.html' %}
{% block content %}
<div class="row">
    <div class="col-md-12 text-center"><h2>Survey About Computer Programming</h2></div>
</div>
<div class="row">
    <div class="col-md-12">
        <h3>Programming</h3>
        <table class="table table-bordered table-striped table-responsive">
            <thead>
                <tr align="center">
                    <th>Main</th>
                    <th class="text-center">Option1</th>
                    <th class="text-center">Option2</th>
                    <th class="text-center">Option3</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Do you love Programming?</td>
                    <td class="text-center"><input type="radio" class=""></td>
                    <td class="text-center"><input type="radio" class=""></td>
                    <td class="text-center"><input type="radio" class=""></td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
    {% endblock %}

{% block js_bottom %}
<script src="/static/survey/js/plugin.js"></script>
{% endblock %}

Answer 2

你错过了重要的事情，当我们创建这样的模板时，我们必须确保每个块如CSS，Content，JS都必须在基本的html文件中正确定义。当您扩展此基本模板时，您必须根据要求构建内容框架。就像你需要在扩展基本html的html页面中放入一些内容一样，只需调用如下 {％block _block_name_should_be_here％} {％endblock％}

块名可能类似于css_part，content_part，js_part，需要使用html页面。

如何扩展Django CMS模板？

2 个答案: