Html 链接'；s面积大于图像

我正试图把一些图片放到我的网站上，这将作为一个超链接到我页面的另一部分。问题是，当我使用

将标记的大小限制在定义的类的范围内时，我正在添加

显示：块

，以确保应用高度/宽度（

显示：内联块

也可以）

我在下面的链接中有两个例子，一个留下了你的利润，另一个保留了它，因为我不确定你在寻找什么

HTML:

---

你可以阅读更多关于CSS

display

的CSS技巧：

我所做的只是删除

左边的空白：-100px。我不知道这个空白的原因是什么，但如果这对你的代码很重要，请让我知道，我会调整我的awnser

如果要将图像向右移动，可以使用以下css：

position:relative;
left:25px;

有关更多信息，请参阅


.firstproject{
背景色：红色；
宽度：100px；
高度：100px；
}
.第二个项目{
背景色：红色；
宽度：100px；
高度：100px；
位置：相对位置；
左：50px；
}



这是因为
img
元素和
a
上的边距。您可以将
a
元素的边距更改为
200px
，并将其从
img
中删除，以在
a
不越界的情况下获得相同的结果

此外，不需要将宽度和高度设置为a。它正在根据内容调整大小


.firstproject img{
高度：100px；
宽度：100px；
背景颜色：蓝色；
}
.firstproject-a{
背景色：红色；
左边距：200px；
}

您可以将
显示：内联块
应用于
标记，这将为您提供预期的结果

要将图像包含在标记中，请将图像集
宽度
设置为
100%



.firstproject{
高度：100px；
宽度：100px；
背景色：红色；
显示：内联块；
}
.firstproject>img{
宽度：100%'
}
p{padding left:100px；}
我使用了边距，因为我想把我的照片放在某个地方，这样我就可以在最后使用边距。我可以看到，有边距的例子中有一个红方块，我实际上是在试图避免它。所以，也许你能告诉我另一种方法来移动我的照片并将其放置在某个位置，而不使用边距标签，从而不创建红色可点击区域？请提供代码而不是url。Url会随着时间的推移而消失。@Rafael_Tsantes您需要更具体一些，有很多方法可以使用CSS移动元素，但这些方法可能都不适用于您的情况。是的，您是对的。下次我会更具体。这一次，由于@Granny，我找到了我的解决方案。您在链接和图像上使用了相同的类，因此现在您的图像增加了链接宽度。如果你不想在链接内留有额外的空间，就不要在图片上留空白。实际上，我想要留空白的部分，因为我想移动我的图片。还有其他的移动方法吗？是的，边距对于我移动照片并将其放置在所需位置非常重要。我会尝试用填充代替边距，但有人告诉我，这将是同样的问题。我更新了我的awnser，加入了移动图像的方法。我会尝试一下，我会让你知道的。谢谢你的灵活性！：）我可以看出，这是一个缺乏我用来定位我的形象。你将如何定位你刚刚发布的代码的img？因为如果你使用margin元素，你会得到和我一样的结果，同样的问题：）
.firstproject {
  height: 100px;
  width: 100px;
  background-color: red;
  margin-left: 100px;
  display: block;
}

.secondproject {
  height: 100px;
  width: 100px;
  background-color: red;
  display: block;
}

position:relative;
left:25px;