如何在html中删除悬停图像的轮廓

我正在尝试删除图像的灰色轮廓。 我看到那个轮廓意味着错误，因为图像标记没有源属性。 但是如果我添加

src=“image.jpg”

，悬停就不起作用

如何修复它？如此困惑

这是我的密码

#项目1{
背景图片：url（'buffer01.jpg'）；
高度：300px；
宽度：300px；
背景重复：无重复；
背景尺寸：封面；
}
#项目1：悬停{
背景图像：url（'buffer-01.jpeg'）；
高度：300px；
宽度：300px；
}

您是否尝试过使用主标识符而不是使用ID

像

.item-image IMG {
 border:none;
}

---

把这个放在你的图像标签上

alt=""

试试这个：

item1:悬停{
边界：没有！重要；
显示：块；
}

奇怪的是，您试图将背景设置为

标记。如果我是你，我会用

来代替。那就很简单了：

HTML:

---

这里有一个小把戏：

您可以使用CSS的

margin

&

overflow

属性应用一个简单的hack

大概是这样的：

/* Image Container (Parent) */
.item-image {
  width: 298px;
  height: 298px;
  overflow: hidden;
}

/* Image (Child) */    
.item-image img {
  margin: -1px;
  background: #eee; /* To show the area covered by image */
}

请看下面的代码段（我已将背景色应用于图像以显示图像区域）：

#项目1{
背景图片：url（'buffer01.jpg'）；
高度：300px；
宽度：300px；
背景重复：无重复；
背景尺寸：封面；
}
#项目1：悬停{
背景图像：url（'buffer-01.jpeg'）；
高度：300px；
宽度：300px；
}
.项目图像{
宽度：298px；
高度：298px；
溢出：隐藏；
}
.项目图像img{
保证金：-1px；
背景：#eee；
}

我看到答案在中给出

---

引用的原因是css中存在打字错误。悬停前删除空格#项目1：是否要将
背景图像
设置为
img
标记？奇怪和
属性最好使用
标记来解决重复问题！我把图像标签改成了div标签：D！我想放一些图片，所以我用了img标签。它导致了一个问题：0。。。谢谢回复！考虑到您正在使用它来设置背景图像而没有前景图像，为什么不简单地将IMG标记改为DIVS，做同样的工作，并且没有占位符边框。
.item {
height:300px;
width :300px;
background-repeat: no-repeat;
background-size : cover;

/*you can remove it*/
border: 1px solid;
}
.item:hover {
background-image: url('http://shushi168.com/data/out/114/36276270-image.png');
height:300px;
width :300px;
}

/* Image Container (Parent) */
.item-image {
  width: 298px;
  height: 298px;
  overflow: hidden;
}

/* Image (Child) */    
.item-image img {
  margin: -1px;
  background: #eee; /* To show the area covered by image */
}

The reason cited is <img> tag does not have proper value in src attribute.