【问题标题】：Trying to make my menu more responsive using the @media code尝试使用@media 代码使我的菜单更具响应性
【发布时间】：2023-03-31 22:21:01
【问题描述】：

所以我有这个代码

@media all and (max-width: 1400px) and (min-width: 951px;){
    #navi2 {
        display: none;
    }
}

@media all and (max-width: 950px;){
    #navi2 {
        display: initial;
    }
    #navi{
        visibility: hidden;
    }
}

#navi{
    // MENU CODE
}

我想这样做是为了让它有点响应，这样如果屏幕较小，navi2 就可以打开。 Navi 适合更大的屏幕。

编辑：问题是代码似乎不起作用。

提前致谢

【问题讨论】：

有什么问题？问题是什么？
代码由于某种原因不起作用！？
您的媒体查询中似乎有一个分号(min-width: 951px;) 删除它。
删除分号然后它的工作。 jsfiddle.net/3gksp002
@PDKnight 谢谢修复！

标签： html css media-queries

【解决方案1】：

您的查询中有一个分号：

@media all and (max-width: 1400px) and (min-width: 951px;){

只需删除分号。就是这样。

JS Bin

【讨论】：

不。不是问题
向我们展示您的 CSS 或网页等。