当在移动设备或平板电脑上查看网站时，通过隐藏 thumbnails_wrapper 使我的网站具有响应性

Question

我对编程比较陌生，并且正在努力处理一些 CSS。我的网站中有缩略图导航栏 (#thumbnails_wrapper)，并且希望在 屏幕尺寸低于宽度 700px 时将其完全隐藏。

以我有限的 CSS 知识，我自己尝试过，但以下代码只是将包装器完全隐藏在任何屏幕上 - 包括全尺寸的桌面屏幕。

@media (min-width:700px){
    #thumbnails_wrapper {
        display:none;
    }
}

非常感谢任何帮助。

谢谢

杰克

Answer 1

您当前的 CSS 定位于浏览器窗口宽度大于 700 像素的任何内容。

将min-width 更改为max-width

@media (max-width:700px){
    #thumbnails_wrapper {
        display:none;
    }
}