css - 当浏览器的宽度为 600px 或更少时在 css 中显示一个元素

Question

我想在屏幕尺寸小于 600 像素时显示我的菜单。因为我在最大宽度小于 600px 时添加了一个条形图标。我使用了以下 CSS 代码。但它没有按预期工作。

.side-nav{
    display: none;
}
@media screen and (max-width: 600px){
    .side-nav{
         display:all;
    }
}

Answer 1

没有display: all。应该是这样的:

.side-nav{
   display: none;
}
@media screen and (max-width: 600px){
   .side-nav{
       display:block;
   }
}

或these之一值(value)观。