Html 如何在简单的CSS汉堡菜单中添加徽标？

我的网站有一个反应灵敏的汉堡包菜单，它使用简单的HTML和CSS，因为我还没有进入JS

我试图添加一个标志的菜单将浮动左侧的菜单时，它是在桌面模式和中心时，它跳转到汉堡菜单下拉菜单

我在下面附上我的代码。我没有找到一个适用于这种简单的CSS/HTML解决方案的解决方案

html，
身体{
宽度：100%；
身高：100%；
保证金：0；
}
html{
字体系列：Arial、Helvetica、无衬线字体；
}
.导航{
边框底部：1px实心#eaeb；
文本对齐：右对齐；
高度：70像素；
线高：70px；
}
.菜单{
利润率：0.30px 0.0；
}
.菜单a{
文字装饰：无；
颜色：灰色；
利润率：0.10px；
线高：70px；
}
跨度{
颜色：#54D17A；
}
标签{
利润率：0.40px 0.0；
字号：26px；
线高：70px；
显示：无；
}
#拨动{
显示：无；
}
@仅介质屏幕和（最大宽度：500px）{
标签{
显示：块；
光标：指针；
}
.菜单{
文本对齐：居中；
宽度：100%；
显示：无；
}
.菜单a{
显示：块；
边框底部：1px实心#eaeb；
保证金：0；
}
#切换：选中+菜单{
显示：块；
}
}

响应菜单
☰

很高兴您正在学习编程，祝您一切顺利。现在让我们来解决你的问题

首先，要理解在你的css代码中，这一行

@media only screen and (max-width: 500px) {
...
}

表示以上标签中的任何内容仅在屏幕最大宽度为500px时显示。有了这样的理解，我们只需要在什么时候用我们想要展示的东西来玩逻辑游戏

现在从您的问题开始，您希望在某一点显示徽标，当它是常规菜单（桌面视图）时，当它是移动屏幕时，您希望它显示在其他位置

我修改了你的css代码，添加了一个名为

.hide

的类。在调用该类的任何地方，它都会在常规菜单中显示，但在移动菜单中，它会隐藏。你可以用同样的逻辑去做你想做的事情。很抱歉，我的代码不是你想要的，但是我的想法就在那里

代码在下面的链接中。如果你需要澄清，请告诉我

---

标记中的徽标/代码在哪里？您需要将其水平调整到500px以下，才能按照CSS媒体查询中的指定触发它。标记中没有徽标或图像的代码，只有汉堡菜单的HTML实体。请编辑您的帖子，使其包含。特别是，我们需要看到这个标志，你说你要添加。你应该至少包括你为达到你想要的结果所做的最接近的尝试。嘿，mw509，非常感谢你的回复。它确实帮助了我，我很感激你添加了这个类，并为我留下了一些空间来填充代码，这将帮助我更好地学习。我将尝试解决方案并让您知道！当然如果你还有其他问题，把它扔到这里，让我们来解决它。我总是很乐意帮忙。如果有帮助的话，别忘了投票答案的第一部分是不必要的；它解释了如何做OP的代码已经做过的事情。@TylerH，1。他说他正在学习。2.他在问一个关于他代码中已有内容的问题。机会是他需要了解一切，因为他正在学习。当我开始编写代码时，我使用了很多东西，但没有完全理解，我们开始时都是这样。我们现在都需要细节，不是吗？mw509我感谢你的解释，你考虑得很周到，我确实对你的答案投了赞成票，但不幸的是，我微薄的声誉不足以让公众看到我的投票。