如何清除：移動設備的懸停樣式？

這裏是我的codepen：Codepen 如何清除：移動設備的懸停樣式？

.sidebar{ 
     width: 100%; 
     position: static; 
     display: block; 
     padding: 50px; 
     margin: 0px; 
     height: 562px; 
     border: none; 
     border-top: 1px solid black; 
     margin-bottom: 5%; 

    }

我設定一個媒體查詢時改變700像素下樣式的頁面。我希望所有的：懸停樣式在頂部導航上消失，但我無法讓它們消失。

此外，我遇到了.sidebar元素和固定頁腳在底部重疊的問題。我在身體的底部添加了邊距，但沒有解決問題。

有什麼建議嗎？

來源

2015-09-26 Michael Bowen

爲什麼不只添加：懸停只有_over_某個屏幕寬度？ – jmargolisvt

我建議使用移動第一種方法進行開發 - 通過這種方式，您可以先爲700px以下的屏幕定義樣式（省略懸停樣式），然後使用媒體查詢，當屏幕大於700像素時將懸停狀態添加到項目 – Jackson

只要把：懸停規則到這樣的疑問： http://codepen.io/anon/pen/pjNRam

@media (min-width: 700px){ 
    nav ul li:hover{ 
    background: #e92121; 
    color: #fff; 
    padding: 10px; 
    font-size: 22px; 
    } 
}

來源

2015-09-26 20:33:14 cuddlecheek

所有你需要做的就是添加了：

導航UL李：懸停

媒體查詢中。選擇器有點太具體，你應該避免它，否則你會在項目後期重寫的東西中遇到問題。以及嘗試使用類。

來源

2015-09-26 20:45:38 Dragod83

如何清除：移動設備的懸停樣式？

回答

相關問題