2015-05-13 34 views
0

我在Dreamweaver中編輯引導程序網頁。在我的下拉菜單中,我希望用戶當前所在的頁面在下拉菜單中突出顯示或以不同的顏色顯示。導航欄位於其自己的頁面中,並鏈接到主站點。 我該如何做到這一點?Dreamweaver中的引導程序網站

這是我目前在main.css的:

ul.nav li.dropdown:hover > ul.dropdown-menu{ 
display: block;  
} 

.nav-header{ 
color:#800; 
margin-left: -10px; 
} 

.active > a, .nav > .active > a { 
color: white; 
background-color: #0A0A0A; 
} 

.active > a, .nav > .active > a:hover { 
color: white; 
background-color: maroon; 
} 
+0

你有問題嗎? – Andrew

+0

您必須使用PHP或Javascript等動態語言添加'.active'類。 – JohnDevelops

回答

1

在您需要的。主動類添加到關聯到您當前頁面上的鏈接的父元素HTML文件,因爲您的CSS正在使用子選擇器>,這意味着它將在.active類中查找<a>標記。例如,如果你是關於我們頁面上,你需要的類添加到關於我們鏈接的父元素象下面這樣:

<ul> 
    <li><a href="index.html">Home Page</a><li> 
    <li class="active" ><a href="about-us.html">About Us</a><li> 
</ul> 

,或者如果導航是在它自己的文件,並在所有的被重用你你可以使用PHP'sbasename()函數和$_SERVER[]超全球。

<?php $currentPage = basename($_SERVER['PHP_SELF']); ?> 
<ul> 
    <li <?php if($currentPage == "index.php") { echo "class='active'"; } ?>><a href="index.php" >Home Page</a></li> 
    <li <?php if($currentPage == "about-us.php") { echo "class='active'"; }?>><a href="about-us.php" >About Us</a></li> 
</ul> 

與上述PHP方案,basename($_SERVER['PHP_SELF']);獲取當前的頁面你是從URL然後導航標記裏面檢查,看是否在當前頁您是等於名稱的名稱與該鏈接關聯的文件。如果是的話,它會把class="active"放在那個鏈接父元素上。

+0

感謝您的回答。我沒有任何PHP文件,所以我需要添加這個,或者我可以把一些代碼放入js腳本中? 謝謝 –