CSS下拉菜單格式問題

我需要一些CSS下拉菜單的幫助。下面的jsfiddle鏈接。CSS下拉菜單格式問題

我需要幫助的兩件事。首先是如何在整個頁面上傳播5個菜單項？我試着用ul li {margin-right：XXX}來做這件事，但是在Item5一直到頁面右邊的那一頁之前，它已經下到了下一行。有任何想法嗎？

第二件事。我試圖改變文本的顏色（在jsfiddle中是藍色），但是當我通過向文本添加類來更改文本顏色時，將文本更改爲白色的懸停操作不起作用。如何更改文字顏色確保懸停仍然有效？

謝謝！

來源

2013-08-03 maccas28

http://jsfiddle.net/G7Ghs – maccas28

請把結果更新到你的小提琴http://jsfiddle.net/G7Ghs/3/
你得到了一些錯別字（例如過渡失蹤的信），我修正了它們。

瀏覽器將字體顏色設置爲藍色，因爲「」表示爲超鏈接，所以您需要選擇該標籤，例如，與

ul li a{ color: orange; } 
ul li a:hover{ color: yellow; }

我定義了一些演示顏色，改變他們喜歡的方式。

要強制5列跨越側，取出餘量右和例如設置

ul li { 
    margin: 0; 
    width:19%; 
    ... }

不知何故20％不起作用，並且列號5將打破到下一行，19％會沒事的。

希望這是你在找什麼。

來源

2013-08-03 22:21:19 dsuess

感謝dsuess回覆。不幸的是：ul li {color：orange}不起作用。改變這種顏色不會改變任何東西，似乎有阻止它改變的東西。至於寬度：19％，它不會超出正確的距離。那邊有沒有填充物阻止它一直穿過？對不起，但我是新來的HTML和CSS。謝謝。 – maccas28

你的鏈接是否仍然顯示爲藍色？我在最新的chrome，firefox，ie10，opera中檢查了小提琴更新號碼3（http://jsfiddle.net/G7Ghs/3/），鏈接不是藍色的。 Item1-5呈橙色，懸停時變爲黃色，Item3A-D呈白色變成綠色。你使用什麼瀏覽器和操作系統？ – dsuess

你已經定義了'ul {text-align：left; }'。「寬度：19％」意思是，你的每個柱面都是頁面寬度的19％。如果一個div內的內容很短（比如item1的五個字符），那麼它就有很大的空間。當然，你可以像在小提琴＃4 http://jsfiddle.net/G7Ghs/4/中一樣將最後一項（item5）設置爲「text-align：right」，但這看起來很奇怪，因爲item4和item5之間的距離是巨大。你可以「文本對齊：中心」，但不同長度的文本行也會看起來很奇怪。（刪除線「顯示：無;」在ul裏的塊中，以使子菜單淡入/淡出） – dsuess

CSS下拉菜單格式問題

回答

相關問題