可点击的div链接，但内部有一个列表（验证）

Question

目标是一个可点击作为链接的方形div，其中包含一个列表。

这证实：

<div class="game"> 
    <a href="link.html"> 
     <img src="image.png" /> 
     <span class="name">Name</span> 
    </a> 
</div> 

，并与<a>设置为display: block我得到的完全可点击的div效果我想要的。

但这种显而易见的原因，不验证（即使浏览器都使其工作）：

<div class="game"> 
    <a href="link.html"> 
     <span class="name">Name</span> 
     <ul> 
      <li>Thing 1</li> 
      <li>Thing 2</li> 
      <li>Thing X</li> 
     </ul> 
    </a> 
</div> 

有没有办法让我的DIV中的列表，对整个DIV是一个块链接，并仍然验证？

Answer 1

把onclick事件您股利和废除锚干脆：

<div class="game" onclick="location.href='link.html';" style="cursor: pointer;"> 
    <span class="name">Name</span> 
    <ul> 
     <li>Thing 1</li> 
     <li>Thing 2</li> 
     <li>Thing X</li> 
    </ul> 
</div> 

不是很漂亮，但它应该验证。

编辑：也大多数浏览器罚款与div：悬停CSS，所以你仍然应该能够得到你的锚风格的CSS。

Answer 2

它可能不是有效的HTML4，但它绝对是有效的HTML5 - 在HTML5中，您可以在<a>之内有<ul> s。