@media（最大宽度：992px）。显示：块不起作用

Question

@media (max-width: 992px) {
    .menu__list {
        display: none;
    }
    .btn__menu {
        display: block;
    }
}

.btn__menu div {
    height: 5px;
    background-color: #000;
    margin-bottom: 5px;
}

.btn__menu {
    width: 40px;
    display: none;
}

上面的代码告诉我 display: block; 有错误。当屏幕宽度小于 992px 时，我需要弹出汉堡菜单，但我什么都没有。我哪里错了？

Answer 1

交换顺序 - 您的一般规则将覆盖媒体查询规则现在的方式，因为它们*在*它们之后。所以只需将媒体查询移到最后即可。