好吧,假设你有这样的事情:
<span class="image" style="background-image: url('http://www.example.com/images/image1.png')"></span>
我读过的每个 CSS 教程都涵盖了在背景图像代码之后使用背景颜色的概念,当图像不可用时,它当然会代替图像,但是...
如何指定备份背景图像 - 如果引用的图像不可用,应显示该图像?如果没有 CSS 技巧,也许 JavaScript 可以处理它?</p>
最佳答案
在现代浏览器中,您可以链接背景图像并在每个节点上拥有多个背景图像。您甚至可以链接 background-position 和 background-repeat 等! 这意味着您可以声明您的第一张图片(这是备用图片),然后第二张图片出现在它上面(如果存在)。
background-color: black;
background-image: url("https://via.placeholder.com/300x300?text=Top Image"), url("https://via.placeholder.com/300x300?text=Failed To Load");
background-position: 0 0, 0 0;
background-repeat: no-repeat, no-repeat;
关于javascript - CSS - 当第一张图片未加载时的额外背景图片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7816951/