输入默认图像以防 html <img> 的 src 属性.无效? [英] Inputting a default image in case the src attribute of an html <img> is not valid?
问题描述
有没有办法在 HTML <img>
标签中呈现默认图像,以防 src
属性无效(仅使用 HTML)?如果没有,您的轻量级解决方法是什么?
Is there any way to render a default image in an HTML <img>
tag, in case the src
attribute is invalid (using only HTML)? If not, what would be your lightweight way to work around it?
推荐答案
您要求 仅 HTML 解决方案...
You asked for an HTML only solution...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Object Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<p>
<object data="http://stackoverflow.com/does-not-exist.png" type="image/png">
<img src="https://cdn.sstatic.net/Img/unified/sprites.svg?v=e5e58ae7df45" alt="Stack Overflow logo and icons and such">
</object>
</p>
</body>
</html>
由于第一张图片不存在,后备图片(本网站上使用的精灵*)将显示.如果您使用的是真的不支持object
,它将忽略该标签并使用 img
标签.有关兼容性,请参阅 caniuse 网站.该元素被 IE6+ 的所有浏览器广泛支持.
Since the first image doesn't exist, the fallback (the sprites used on this web site*) will display. And if you're using a really old browser that doesn't support object
, it will ignore that tag and use the img
tag. See caniuse website for compatibility. This element is widely supported by all browsers from IE6+.
* 除非图像的 URL 更改(再次),在这种情况下,您可能会看到替换文字.
这篇关于输入默认图像以防 html <img> 的 src 属性.无效?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!