Html 使背景图像和内容都可单击

我想让背景图像以及其中的内容都可以点击。我不知道如何实施它

图像：

我希望图像和内容都可以点击

html部分：

<div class = "reportslistitem">
   <a href="[[ url ]]"
       target=="_blank">
          [[ startdate ]] -
           [[ enddate ]]
   </a>  
</div>

---

我如何改变它？需要一些指导

如果您使用HTML5，那么现在可以使用锚定标记包装整个部分，因此

<a href="[[ url ]]" target="_blank">
   <div class = "reportslistitem">
          [[ startdate ]] - [[ enddate ]]
   </div> 
</a> 

---

如果您使用HTML5，那么现在可以使用锚定标记将整个部分包装起来，这样就可以了

<a href="[[ url ]]" target="_blank">
   <div class = "reportslistitem">
          [[ startdate ]] - [[ enddate ]]
   </div> 
</a> 

---

背景无法单击。尽管可以通过将背景图像指定给链接来模拟这种行为

---

只需删除/省略

DIV

，并将该类设置为锚点<代码>显示：块也可以分配给链接，以允许指定宽度和高度。

背景不能单击。尽管可以通过将背景图像指定给链接来模拟这种行为

---

只需删除/省略

DIV

，并将该类设置为锚点<代码>显示：块也可以分配给链接，以允许指定宽度和高度。

您需要查看css，如果您可以将代码添加到此链接中，我将非常乐意将其添加到Work中。让我试试看，我必须使用position:relative并将其移回右侧？但是为什么它会向下移动？你能确认它是否有效吗？如果是，请标记为正确答案。谢谢你需要tweek你的css，如果你能把你的代码添加到这里，我会非常乐意把它用到workOK让我试着找出它我必须使用position:relative并把它移回右边？但是为什么它会向下移动？你能确认它是否有效吗？如果是，请标记为正确答案。谢谢

.reportslistitem{
    width:120px;
    height:140px;
    display:block;
    background:url('../images/Report-icon-without-text.png');
}


a{
 font: bold 12px 'Thin2Regular';
 text-decoration: none;
 color: rgb(0,0,0);
 padding: 10px 15px;
 text-align: center;
 padding: 0px;
 display:block;
 width:120px;
 height:140px;
 }​