Css 仅在桌面上隐藏徽标[wordpress]

我正在WordPress中开发一个网站，在那里我使用nav图像插件将徽标置于标题菜单项的中心。基本上，我想做的是隐藏台式机/笔记本电脑上的主徽标区域（标题上方），以便徽标仅显示为导航菜单图像。我还想隐藏手机/平板电脑上的菜单图像（链接到主页），因为它在导航菜单中显示为空白

网站为：

主标志：

.gbtr_logo {

}

.menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-2716 has-image {

}

手机上的徽标导航菜单：

.gbtr_logo {

}

.menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-2716 has-image {

}

我在这里找到了样式，但不确定如何实现：

我感谢你的任何意见。谢谢。

您可以使用媒体查询 //使用768px的设备

@media (max-width:768px){

.menu-item menu-item-type-custom menu-item-object-custom menu-item-home menu-item-2716 has-image {
display:none;
}

}

---

只需将其放在主题样式中。css

我强烈推荐此资源，以帮助您处理HTML css，特别是您的媒体查询：

---

当宽度小于1000px或介于600px和1000px.Hi之间时，使用媒体查询（谷歌CSS媒体查询）应用特定规则。我的徽标只显示在笔记本电脑/台式机上，但无法在手机/平板电脑上隐藏菜单项。可能我使用了错误的类？可能是，请正确检查元素并相应地使用选择器。整个想法是使用媒体查询