更改導航欄懸停圖標

Question

目前我有一個代碼示例，其功能方式是，如果導航欄上的鏈接具有子選項，則鏈接旁邊會有一個小號「+」號。當用戶懸停在鏈接上時，這將更改爲「 - 」，並在下拉菜單中顯示子選項。我想要做的就是將其改爲黃色「V」形（不管用戶是否懸停，都保持靜態），但我不知道如何去做。

我有很長的代碼示例，我知道這是關於CSS的a:before和a:after部分，但我不確定我需要更改哪些部分。任何幫助將不勝感激。

http://pastie.org/private/tsuwnney7kiibhiuaambjq

Answer 1

你看到的，看起來像一個+或-實際上是在兩個線條的纖細視覺把戲，一個垂直於水平，疊加，如編碼這裏：

#cssmenu > ul > li.has-sub > a:after { 
    position: absolute; 
    top: 22px; 
    right: 11px; 
    width: 8px; 
    height: 2px; 
    display: block; 
    background: #dddddd; 
    content: ''; 
} 
#cssmenu > ul > li.has-sub > a:before { 
    position: absolute; 
    top: 19px; 
    right: 14px; 
    display: block; 
    width: 2px; 
    height: 8px; 
    background: #dddddd; 
    content: ''; 
    -webkit-transition: all .25s ease; 
    -moz-transition: all .25s ease; 
    -ms-transition: all .25s ease; 
    -o-transition: all .25s ease; 
    transition: all .25s ease; 
} 

要修復它，你需要做這樣的事情：

#cssmenu > ul > li.has-sub > a:after { 
    /*you don't need this style anymore */ 
} 
#cssmenu > ul > li.has-sub > a:before { 
     position: absolute; 
     top: 19px; 
     right: 14px; 
     display: block; 
     width: 16px; 
     height: 16px; 
     background: url([your yellow triangle image icon path goes here]) no-repeat; 
     content: ''; 
    } 

你還需要刪除動態行爲喲你在你的示例代碼中描述了它看起來可能是第91行。