添加類負載的div

可能重複：
highlight the navigation menu for the current page 添加類負載的div

我的工作由幾個的DIV的菜單上，每一個獨特的CSS ID。懸停選擇器已經在CSS中使用，試圖給每個div一個不同的樣式，當其相應的頁面被查看時，但它似乎並沒有生效。我的CSS和HTML可以在JSFiddle中看到。基本上，因爲這些div用於創建菜單，所以我希望在查看超級鏈接頁面時將「活動」類添加到div中（當某人在我的「主頁」頁面上時，我想要要應用於「主頁」菜單div的活動樣式）。

#pagebuttonhome { 
 
    width: 130px; 
 
    height: 30px; 
 
    background-color: #ffe0e8; 
 
    position: absolute; 
 
    overflow: hidden; 
 
    left: 30px; 
 
    bottom: 0px; 
 
    font-size: 17px; 
 
    letter-spacing: 2px; 
 
    text-align: center; 
 
    line-height: 30px; 
 
    color: #dc2d18; 
 
} 
 
#pagebuttonhome:hover { 
 
    background-color: #dc2d18; 
 
    color: #ffe0e8; 
 
    height: 40px; 
 
    cursor: pointer; 
 
} 
 
#pagebuttonhome.active { 
 
    background-color: #dc2d18; 
 
    color: #ffe0e8; 
 
    height: 40px; 
 
    cursor: pointer; 
 
}

<div id="pagebuttonhome">HOME</div>

我明白任何幫助！

來源

2012-09-08 Marcatectura

解決此問題的一種方法是在每個頁面上爲身體添加一個唯一的ID。例如，<body id="homelink">首頁，<body id="aboutlink">您對頁面上（如果有的話）等。然後，用

#homelink #pagebuttonhome, 
#aboutlink #pagebuttonabout

更換#pagebuttonhome.active選擇，它會選擇並高亮顯示該鏈接爲你的頁面沒有你需要使用JavaScript。

http://jsfiddle.net/MEnKR/11/

來源

2012-09-08 01:53:23

邁克爾，完美的工作，謝謝！ – Marcatectura

很高興工作。 –

添加類負載的div

回答

相關問題