最好的替代方法<a><li></li></a>？

Question

我寫的那一刻網頁和剛剛驗證了它 - W3C驗證不喜歡這樣的：

<nav id="footNav"> 
    <ul> 
      <a href="contact.html"><li>Contact</li></a> 
      <a href="access.html"><li>Accessibility</li></a><br> 
      <li>&copy; A dev, 2015</li> 
    </ul> 
<nav id="footNav"> 

由於鏈接的列表元素之外。我可以接受這是做錯的方法，但我應該如何替換它？我想要的效果是'按鈕' - 即您不必點擊文本，您可以單擊鏈接常規（填充）區域中的任意位置。

謝謝！

Answer 1

是的，這是一個無效的標記。 ul元素只能有li孩子。您可以將a元素與列表元素交換，並在您的CSS中使用display: block規則。現在a元素是塊元素佔用所有可用空間。

<style> 
#footNav li a { 
    display: block; 
} 
</style> 
<nav id="footNav"> 
    <ul> 
     <li><a href="contact.html">Contact</a></li> 
     <li><a href="access.html">Accessibility</a></li> 
     <li>&copy; A dev, 2015</li> 
    </ul> 
</nav>