正確的導航語法

Question

我懷疑用於導航的語法如下所示。

我沒有創建CSS文件還沒有，但這裏是這應該是如何工作的。例如，如果我點擊鏈接一個在導航欄中的主要內容將顯示第一個元素等，休息將被隱藏。

這裏是first variant

<nav role='navigation'> 
    <a href="first">First</a> 
    <a href="hello">Hello</a> 
    <a href="best">Best button ever</a> 
</nav> 
<section> 
    <p class"1">X</p> 
    <p class"hello">Hello</p> 
    <p class"best">Im the best p element of the world</p> 
</section> 

HTML代碼簡潔，乾淨，但是在CSS/JavaScript的更多的工作比這第二個解決方案here

<nav role='navigation'> 
    <ul> 
    <li>Show child 
     <ul> 
     <li>Vestibulum auctor dapibus neque.</li> 
     </ul> 
    </li> 

    <li>Show child 
     <ul> 
     <li>Vestibulum auctor dapibus neque.</li> 
     </ul> 
    </li> 

    <li>Show child 
     <ul> 
     <li>Vestibulum auctor dapibus neque.</li> 
     </ul> 
    </li> 
    </ul> 
</nav> 

哪一個變量，爲什麼你會推薦我？

Answer 1

我推薦你使用第一個例子。對於你想要達到的目標來說，這已經足夠了 - 第二個例子涉及使用嵌套的<ul>列表，這些列表完全沒有必要，並且需要大量額外的標記，當你需要的只是每個導航項目的基本鏈接元素時。