HTML5導航菜單文本

Question

我正在嘗試使用HTML5中的<nav>製作一個帶有簡單文本和3個鏈接的導航欄。這是非常基本的，但我的鏈接的文本混雜起來，我不知道爲什麼。

↪See my code at JSFiddle

Answer 1

你需要你的浮動LI，不是你的UL。無需position:absolute。如果您想將菜單移至右側，您可以使用或將其浮動，或使用margin:left。一定要清除你的花車後。

見我的教程：I Love Lists

Answer 2

，這是因爲位置的：絕對和位置：相對部分在你的CSS。

試試這個：

nav { 
    width:100%; 
    height:181px; 
    display: block; 
    background: url('http://i.imgur.com/JrTUv.png') top no-repeat; 
    margin-top:30px; 
} 
nav ul { 
    float:right; 
    list-style:none; 
} 

nav ul li { 
    display:inline-block; 
}