導航欄當前狀態

-1

大家好我爲我的網站做了導航。當我轉到其他頁面時，我只想更改鏈接的顏色。例如，我點擊「關於」，然後我將轉到關於我喜歡關於頁面的鏈接，當我處於關於頁面時，鏈接將變成紅色。導航欄當前狀態

我該怎麼做？謝謝！

這裏的代碼

HTML

<nav> 
    <ul> 
     <li><a href="index.htm">Home</a></li> 
     <li><a href="about.htm">About</a></li> 
     <li><a href="#">Services</a></li> 
     <li><a href="#">Creatives For Less</a></li> 
     <li><a href="#">Blogs</a></li> 
     <li><a href="#">Contact</a></li> 
    </ul> 
</nav>

CSS：

nav { 
    float: right; 
    margin-top: 13px; 
    margin-right: 40px; 
} 

nav ul { 
    font-family: josefin; 
    list-style-type: none; 
    font-size: 11pt; 
    text-transform: uppercase; 
} 

nav li { 
    display: inline; 
    padding-left: 15px; 

} 

nav li a{ 
    text-decoration: none; 
    color: #0ff; 
} 

nav li a:hover, a:active { 
    color: #fff; 
}

來源

2013-07-17 user2593297

部屋指派他們，歡迎SO！如果你問一個問題，如果你包括你已經嘗試過的東西，你正在使用的約束條件等等，這會有所幫助。請注意，你可以編輯你的問題來添加這些細節。 – Jeroen

你的問題有點模棱兩可。您是否說您想要「關於」爲紅色，因爲您目前正在查看「關於」頁面，或者因爲您在某個時間點查看了「關於」頁面。換句話說，如果你（從關於頁面）點擊鏈接到「索引」頁面，在加載的新頁面上，「家」是紅色的，還是「關於」，或兩者？ –

你可以添加一些CSS類與JavaScript或一些服務器端語言。

如果您將使用JavaScript，您應該找到指示您用戶在頁面上的內容（例如某些帶有信息的div）。然後，如果您使用JQuery，請添加此類：

$('#mylink').addClass('active');

來源

2013-07-17 22:10:51

我不會建議這樣做;使用JQuery來處理這些微不足道的事情應該可以像一般的做法一樣避免。 – SharkofMirkwood

只要有一個active類，如果你是一個頁面上，設置<li>有該類。

例如：

<li class="active"><a href="#">Services</a></li>

而且在你的CSS樣式active類：

nav li.active a{ 
    color: red; 
}

如果你問你怎麼知道你是哪個網頁上，雖然和希望動態執行此操作，您需要使用PHP，其他服務器端語言或JavaScript。

來源

2013-07-17 22:09:08 SharkofMirkwood

在您的CSS中使用a：visited。

a：visited { background-color：yellow; }

你應該考慮過設置它們類，然後通過CSS

來源

2013-07-17 22:10:51 null

導航欄當前狀態

回答

相關問題