编辑:并不能真正解决问题，但可能仍然有用。

这就是我对SASS/SCSS所做的。我有实用工具scss文件，其中包含这个mixin:

  @mixin fallback() {
    background-image: url('/assets/imgs/fallback.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
  }

它在.scss中的用法

img {
  // ...
  @include fallback();
}

一种不需要任何代码的基本且非常简单的方法是只提供一个空的alt语句。然后浏览器将返回空白图像。它看起来就像没有图像一样。

例子:

<img class="img_gal" alt="" src="awesome.jpg">

试试看吧!；）

可以使用before和after作为样式，以防止图像损坏。

<img src="Error.src">

img:before {
  content: url("image.jpg");
}

img:after {
  content: "(url: " attr(src) ")";
}

在这种情况下，如果src中的图像被破坏了，它将使用之前的内容，如果没有错误，它将使用src。

我喜欢尼克的答案，并一直在研究这个解决方案。找到了一个更干净的方法。由于::before/::after伪元素不能用于替换的元素，如img和object，它们只在对象数据(src)未加载时才会工作。它使HTML更加清晰，并且只在对象加载失败时才添加pseudo。

对象{ 位置:相对; 浮:左; 显示:块; 宽度:200 px; 身高:200 px; margin-right: 20 px; 边框:1px纯黑色; ｝ 对象::{后 位置:绝对的; 上图:0; 左:0; 显示:块; 宽度:100%; 高度:100%; 内容:”; 背景:红色url(“http://placehold.it/200x200”); ｝ <object data="http://lorempixel.com/200/200/people/1" type="image/png"></object> . <对象数据= " http://broken。img / url " type = " / png图像“> < /对象>

隐藏图像alt与此

img {
   color: transparent;
}

如果你将添加alt与文本alt="abc"，它将显示显示腐败缩略图，和alt消息abc

<img src="pic_trulli.jpg" alt="abc"/>

如果你不添加alt，它将显示显示腐败缩略图

<img src="pic_trulli.jpg"/>

如果你想把坏掉的藏起来 只需添加alt=""它将不会显示损坏的缩略图和任何alt消息(不使用js)

<img src="pic_trulli.jpg" alt=""/>

如果你想把坏掉的藏起来 只需添加alt="" & onerror="this.style。Display ='none'"它不会显示损坏的缩略图和任何Alt消息(与js)

<img src="pic_trulli.jpg" alt="abc" onerror="this.style.display='none'"/>

第四个有点危险(不完全是) ，如果你想在onerror事件中添加任何图像，即使image作为样式存在，它也不会显示。显示就像加法。因此，当您不需要任何替代图像显示时使用它。

display: 'none'; // in css

如果我们在CSS中给出它，那么项目将不会显示(像image, iframe, div之类的)。

如果你想显示图像&你想显示完全空白，如果错误，那么你可以使用，但也要小心，这不会占用任何空间。所以，你需要把它保存在一个div中

链接https://jsfiddle.net/02d9yshw/