我有這個網站的http://camerabeanbags.co.uk/test 和頂部的導航菜單,你可以看到當你將鼠標懸停在菜單上的文本在灰色背景顯示在文本後面。CSS來改變活動導航菜單頁面的設置背景
可以使用什麼CSS代碼在活動頁面後面顯示灰色背景?所以,如果我在主頁上,那麼菜單背後的主頁文本顯示灰色背景?
感謝,
哈維
我有這個網站的http://camerabeanbags.co.uk/test 和頂部的導航菜單,你可以看到當你將鼠標懸停在菜單上的文本在灰色背景顯示在文本後面。CSS來改變活動導航菜單頁面的設置背景
可以使用什麼CSS代碼在活動頁面後面顯示灰色背景?所以,如果我在主頁上,那麼菜單背後的主頁文本顯示灰色背景?
感謝,
哈維
無需添加背景或其他任何你的代碼。
li.current-menu-item a,
nav a:active,
nav a:focus {
color: #406639 !important;
}
li.current-menu-item a:before,
nav a:active:before,
nav a:focus:before {
transform: scaleX(1);
}
這將觸發你有懸停狀態的默認風格。
編輯: 我已經更新答案充分的事情,你需要。 :) 請注意,我不得不添加重要的,因爲你有這個選擇很重要:
a:focus {
color: #c9c9c9 !important;
text-decoration: none;
}
你可以使用:
li.current-menu-item:hover > a {
background: #e8e8e8;
}
,我可以看到你用::作爲背景效果這是對懸停...使它在活動狀態你可以使用:
nav li.active a:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: -1;
background: #e8e8e8;
transform: scaleX(0);
transition: transform .25s;}
另外,需要添加活動類與李
嗨此代碼的工作完美,我將如何能夠設置活動菜單頁面上的文字是綠色的,以及喜歡它徘徊時? – Harvey
嘿哈維,你可以很容易地添加'li.current-menu-item一個{顏色:#406639;}'應該做的竅門 –
是的,這是完美的感謝,任何想法如何設置,所以當點擊一個菜單項它會轉到活動時的顏色。帶有綠色文本的灰色背景?然後它將是完美:) – Harvey