Html 为什么我想要的超链接会出现在不同的图像中？

我对HTML/CSS非常陌生，我刚刚开始了一个新的网页。我正在尝试向样式表中的图像添加超链接。但是，当我将重定向url添加到我的div元素时，重定向不会出现在预期的元素上，而是出现在它旁边的元素上。有人能看出我哪里出了错吗

这是我的JSFIDLE：

HTML：
CSS:
.1项目1{
背景图像：url（'https://pbs.twimg.com/media/D5gQCxCW0AE0skl.jpg');
宽度：100%；
身高：200%；
}

首先，您不会关闭链接标签，因此可以单击链接标签后的任何内容

此外，您的链接没有任何内容，您也没有为其设置任何尺寸，因此它的宽度变为0，您无法单击它

将链接设置为

item1

：

<a class="item1" href="https://www.bbc.co.uk/sport/football"></a>

---

您将锚定标记放在div内，应该是另一个方向。您没有关闭锚定标记，这就是为什么它应用于它旁边的元素

---

更改

错误在HTML中。 您忘记关闭

你还没有关闭链接-正如@Pete所说，你错过了关闭链接的

。尽管如此，这很可能无法完全解决您的问题。因为链接实际上是不可点击的。您可能应该做的是将背景添加到

，然后删除整个

@Pete您的意思是在末尾添加吗？如果是这样的话，当我在末尾添加它时，它会变得没有响应。在它里面放一些东西，或者设置它的样式，这样它会占用一些空间。阅读我的评论中的链接。你还需要将它设置为内联块或块，以便它获取该类的维度

<a class="item1" href="https://www.bbc.co.uk/sport/football"></a>

<a href="https://www.bbc.co.uk/sport/football"><div class="item1"></div></a>