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

这就是我对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();
}

如果你仍然需要让图像容器可见，因为它稍后会被填充，并且不想麻烦地显示和隐藏它，你可以在src中插入一个1x1的透明图像:

<img id="active-image" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP/// yh5baeaaaaalaaaaabaaeaaaibraa7 "/>

我就是为了这个目的用的。我有一个图像容器，它将通过Ajax将图像加载到其中。因为图片比较大，需要一点时间来加载，所以需要在CSS中设置一个Gif加载条的背景图片。

但是，由于src为空，在使用它的浏览器中仍然会出现破碎的图像图标。

设置透明的1x1 Gif简单有效地解决了这个问题，无需通过CSS或JavaScript添加代码。

在理论:

严格的“css only”，我们没有干净的选择。看到其他答案，我没什么可补充的。

在实践中:

我认为在错误事件上添加一个类是最好的方法。这就是我的意思-有答案几乎是这样的，原则是一样的，只是如果你不直接添加样式声明会更优雅。相反，添加一个以后可以针对的类:

   <img src="..." onerror="this.classList.add('notfound')">

现在你可以使用img对它进行样式化。没有找到作为选择器。你可以养成一个习惯，把这个小片段添加到你所有的图像中;在你做好造型之前不会有任何伤害。

旁注，在有人评论“这不是一个css唯一的解决方案”之前:是的，谢谢你，队长，确实不是。我试图帮助解决问题本身，一个很多人可能会遇到的问题，而不仅仅是看确切的措辞。

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

例子:

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

试试看吧!；）

在https://bitsofco.de/styling-broken-images/找到了一个很好的解决方案

img { position: relative; } /* style this to fit your needs */ /* and remove [alt] to apply to all images*/ img[alt]:after { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; font-family: 'Helvetica'; font-weight: 300; line-height: 2; text-align: center; content: attr(alt); } <img src="error"> <br> <img src="broken" alt="A broken image"> <br> <img src="https://images-na.ssl-images-amazon.com/images/I/218eLEn0fuL.png" alt="A bird" style="width: 120px">

隐藏图像alt与此

img {
   color: transparent;
}