制作響應式菜單，css不適用於某些媒體查詢

Question

我正在制作響應式菜單，但媒體查詢中有問題-CSS不適用。 您可以在JSFiddle上查看它。 在JavaScript和Result之間滑動，您可以看到問題所在...單擊Toggle菜單。 問題是在此查詢@media only屏幕和（最大寬度：767px）

@media only screen and (max-width: 767px) {
.menu-main, .logo-seperator {
    display:none;
}

.toggle-menu{
    width:100%;
    margin-top:110px;
    height:40px;
    background-color:#6c6c6c;
    display:block;
}

 /*DOESNT APPLY*/
.menu_main{
    background:blue;
    width:100%;
    z-index: 20;
}
 /*DOESNT APPLY*/
.menu_main li{
    text-decoration: none !important;
    width:100% !important;
    height:20px !important;
    background-color:black !important;
}
}

Answer 1

有一個錯字。 在您提到的媒體查詢中，css選擇器使用下划線而不是破折號：

這： .menu_main

應該是： .menu-main

http://jsfiddle.net/WF7CX/

此外，text-decoration屬性也應應用於錨標記，而不是列表項。