如何从折叠的导航栏中排除徽标？[Bootstrap/HTML] 我试图做到这一点，当用户在他们的桌面上时，网站的徽标将在导航栏的中间可见。但是，我也希望这样，当用户在移动设备上时，徽标的位置会更改为屏幕的右上角，激活导航栏的按钮位于左侧。目前，我把它放在了中间，它只是停留在那里，这导致它也在折叠的导航栏中。我怎样才能把它排除在外呢

谢谢。

如果我理解正确，我会这样做：

将

d-none d-lg-block

类添加到中间的logo

img

标签，使其仅显示桌面

然后添加一个重复的

img

作为

.container fluid

中的最后一项，并向其添加

d-block d-lg-none

类，使其显示在移动设备上，而不是桌面上

然后将

flex nowrap

添加到

nav

标签中，这样徽标将与切换按钮一起显示

最后，将

align self start

类添加到duplicate/mobile

img

中，使其在导航打开时与切换按钮保持一致

它应该是这样的：

这就是你要找的吗

[更新]

我没有看到您使用的是Bootstrap 5。我添加了一个

.text end

容器，它包装了

按钮.nav togger

和

.navbar collapse

，并为样式添加了一些其他实用程序类

---

对于Bootstrap 5:

这里有另一种不需要复制徽标的方法。要从收拢导航栏中排除徽标（或任何其他内容），必须将其从收拢导航栏中删除

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container-fluid">
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".dual-collapse2">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="navbar-collapse collapse w-100 dual-collapse2 order-1 order-md-0">
            <ul class="navbar-nav ms-auto text-center">
                <li class="nav-item active">
                    <a class="nav-link" href="#">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">About</a>
                </li>
            </ul>
        </div>
        <div class="mx-lg-auto my-2 order-0 order-md-1 position-relative">
            <a class="mx-auto" href="#"><img src="//via.placeholder.com/50/ccff00" class="rounded-circle"></a>
        </div>
        <div class="navbar-collapse collapse w-100 dual-collapse2 order-2 order-md-2">
            <ul class="navbar-nav me-auto text-center">
                <li class="nav-item">
                    <a class="nav-link" href="#">Portfolio</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#">Contact</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

---

如果没有完整的代码，很难回答您的问题，至少您必须共享标题部分代码和屏幕截图@NazmulHossainPappu我没有标题部分-这段代码是我身体部分中唯一的东西。嘿，这正是我想要的，除了我想交换图像和导航栏切换按钮。此外，由于某些原因，当我启用切换时，元素的定位会出错。截图：我编辑了代码笔来交换定位。我将

.flex row reverse

添加到

nav

，

中。将content end

对齐到包裹

的
.container fluid
中。navbar toggler

和

navbar collapse

以及

navbar nav>.text right

中。您对我在那里做了什么以及为什么做有任何疑问吗？出于某种原因，当您单击切换时，我仍然对导航栏元素的位置有疑问。看到下面的截图，你能发布你的代码吗？那我可以帮你更多。当然，这是：