我正在使用HTML nav标记在我的网站(基于Django / Bootstrap构建)中显示面包屑。

我正在尝试显示Shop by Departments的下拉菜单,然后显示面包屑。但是有人,订单混乱了。 Shop by Departments出现在最后,而不是第一件事。

我的代码是:

<div class="animate-dropdown">
<!-- ========================================= BREADCRUMB ========================================= --><div id="top-mega-nav">
<div class="container">
    <nav>
    {% include "partials/nav_primary.html" with expand_dropdown=0 %}
    <li class="breadcrumb-nav-holder">
        <ul>
        {% with category=product.categories.all.0 %}
            {% for c in category.get_ancestors_and_self %}
                <li class="breadcrumb-item">
                    <a href="{{ c.get_absolute_url }}">{{ c.name }}</a>
                </li><!-- /.breadcrumb-item -->
            {% endfor %}
            <li class="active">{{ product.title }}</li>
            {% get_back_button as backbutton %}
            {% if backbutton %}
                <li class="pull-right">
                    <a href="{{ backbutton.url }}">
                        <i class="icon-arrow-left"></i> {{ backbutton.title }}
                    </a>
                </li>
            {% endif %}
        {% endwith %}

        </ul>
    </li><!-- /.breadcrumb-nav-holder -->
    </nav>
    </div>
</div><!-- /.container -->





我使用检查器检查了网页,代码顺序符合预期。但是渲染不是。怎么了

编辑:检查器中的输出看起来像

最佳答案

您呈现的HTML无效。那就是可能导致问题的原因。
li元素必须具有父ul(或ol)元素。
因此,如果在ul周围添加li class="breacrumb-nav-holder",它应该可以正常工作。

09-25 15:58
查看更多