媒体查询不起作用

Question

该菜单没有响应。它似乎超出了条件。

@media only screen and (min-width : 320px) and (max-width : 568px) {
   .menu {
    background: transparent url(menu.png) no-repeat;
    display: inline-block;
    visibility:visible;
  }

.menu {
        background: transparent url(menu.png) no-repeat;
        display: none;
        visibility:hidden;   
    }

Answer 1

首先

.menu {
        background: transparent url(menu.png) no-repeat;
        display: none;
        visibility:hidden;   
    }

然后

@media only screen and (min-width : 320px) and (max-width : 568px) {
   .menu {
    background: transparent url(menu.png) no-repeat;
    display: inline-block;
    visibility:visible;
  } }