Question

我不知道如何突出显示导航栏的活动链接。这是我的解决方案，但是没有用： navbar.html中包含的base.html：

<nav class="navbar navbar-expand-sm bg-light navbar-light border-bottom" style='right:0px;'>
<!-- Brand -->
    <a class="navbar-brand" href="{% url 'blog:home' %}">Logo</a>

    <!-- Links -->
    <ul class="navbar-nav">
        <li class="nav-item">
            <a class="nav-link {% block home_active %}  {% endblock home_active %}" href="{% url 'blog:home' %}">Home</a>
        </li>
        <li class="nav-item">
            <a class="nav-link {% block blog-active %}  {% endblock blog-active %}" href="{% url 'blog:blogs' %}">Blog</a>
        </li>
        {% if user.is_authenticated %}
        <li class="nav-item">
            <a class="nav-link  {% block create-active %}  {% endblock create-active %}" href="{% url 'blog:blog_create' %}">Create</a>
        </li>
        {% endif %}
        <!-- Dropdown -->
        <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown">
            Dropdown link
        </a>
        <div class="dropdown-menu">
            <a class="dropdown-item" href="#">Link 1</a>
            <a class="dropdown-item" href="#">Link 2</a>
            <a class="dropdown-item" href="#">Link 3</a>
        </div>
        </li>
    </ul>
</nav>

如您所见，我在每个链接中都添加了{% block home_active %} {% endblock home_active %}之类的内容，然后在模板中以active的形式添加了home.html：

{% block home_active %}
 active
{% endblock home_active %}

我想知道为什么单击每个链接时都不会将active类应用于这些链接。请帮我解决一下这个。谢谢

edit：我刚刚注意到，从{% include 'include/navbar.html' %}运行此代码base.html的代码没有问题。当我删除包含并在navbar.html中复制base.html时，它工作正常。为什么会这样，我该如何解决？

如何突出显示导航栏的活动链接？

0 个答案: