Question

我的导航丸出现在一排。但是一旦我向它添加了django模板标签，这些药片就堆叠在一起了。

如何解决这个问题，让药片全部出现在一行？

没有django标签

<ul class="nav nav-pills">
  <li role="presentation" class="active"><a href="#">Home</a></li>
  <li role="presentation"><a href="#">Profile</a></li>
  <li role="presentation"><a href="#">Messages</a></li>
</ul>

使用django标签

{% for menu in menus %}
<ul class="nav nav-pills">
    {% if menu.mealtype == 'Breakfast' %}
        <li role="presentation" class="active"><a href="#">Home</a></li>
    {% endif %}
    {% if menu.mealtype == 'Lunch' %}
        <li role="presentation"><a href="#">Profile</a></li>
    {% endif %}
</ul>
{% endfor %}

Answer 1

您的问题是for for循环{% for menu in menus %}也重复了<ul>标记。您为每个条目单独制作一个列表。

尝试在for标记内移动<ul>循环。

<ul class="nav nav-pills">
{% for menu in menus %}
    {% if menu.mealtype == 'Breakfast' %}
        <li role="presentation" class="active"><a href="#">Home</a></li>
    {% endif %}
    {% if menu.mealtype == 'Lunch' %}
        <li role="presentation"><a href="#">Profile</a></li>
    {% endif %}
{% endfor %}
</ul>

添加django模板标签后，html表现不同

1 个答案: