在不同的頁面上顯示菜單項

Question

我的導航欄中有兩組菜單項。

設置1標有「.homemenuitem」

集2標有「.othermenuitem」

我想所有其他網頁上顯示的主頁和othermenuitems上homemenuitems。

我希望能用CSS做到這一點。

我開始用下面的

.home .othermenuitem { 
    display: none; 
} 

足見其主頁上的正確的菜單，但我無法弄清楚如何隱藏所有其他網頁上的homemenuitems不使用獨特的頁面ID（其隨着網站的發展將會變得很痛苦）。

任何幫助將不勝感激。

感謝

Answer 1

在這裏的「層疊樣式表」的「級聯」的部分是你的朋友。更具體的規則始終覆蓋不太具體的，所以，如果你這樣做：

.homemenuitems { 
    display: none; 
} 
.home .homemenuitems { 
    display: block; /* or 'inline' or 'inline-block', as necessary */ 
} 

那麼後面的規則將覆蓋它匹配前（在主頁上），否則，第一條規則將始終生效。

Answer 2

你可以採取其他的方式，使得：

.homemenuitem { 
    display: none; 
} 

在您的網站的每一個頁面，只顯示在主頁上的ID呢？

Answer 3

感謝邁克爾，稍微調整了一下，這對我來說很有效，如果有人正在尋找類似的情況。

.homemenuitem { 
    display: none; 
} 
.home .othermenuitem { 
    display: none; 
} 
.home .homemenuitem { 
    display: inline-block; 
} 

Answer 4

我已經在很多場合試過了，你可以使用這段代碼.homemenuitem {display：none; } .home .othermenuitem {display：none; } .home .homemenuitem {display：inline-block; }