Existe una combinación de
lowsrc con
map para
Netscape y también hasta
IE7, que nunca funcionó. Por lo demás, si una imagen no carga, es un error; y se puede manejar con eventos. Pero es medio riesgoso en algunos casos; ahí debes poner un límite a las recargas o usar una imagen dentro del código fuente.
También puedes aprovechar el
alt y meterle un caracter de substitución (␜ , �), o de tachado (☒ , ✕ , ✖ , ✗ , ✘).
La solución más obvia es
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8">
<title>REEMPLAZO DE IMÁGENES.</title>
<style type="text/css">
img {background-image: url("http://static.forosdelweb.com/images/misc/cross.png"); background-color: white; display: block; margin: 10px; font-size: 40px; font-weight: bold; color: #800000; }
</style>
</head>
<body>
<h2>Carga imagen, si no existe, muestra fondo.</h2>
<img src="http://img338.imageshack.us/img338/7682/relojvillalongafurlongm.jpg" alt="Imagen." title="Imagen." width="640" height="480">
<img src="falsa.jpg" alt=" ✘ Imagen No Cargada." title="Imagen Falsa." width="640" height="480" >
<hr>
<h2>Cajas con el tamaño de las imágenes. Muestra fondos. (Op, FF?, Chr)</h2>
<div style="background-image: url('http://img23.imageshack.us/img23/179/cerbezas.jpg') , url('http://img12.imageshack.us/img12/1940/podrida.jpg'); width: 640px; height: 480px; margin: 10px; " title="Carga primer y segundo background. Muestra primero." ></div>
<div style="background-image: url('falsa.png') , url('http://img12.imageshack.us/img12/1940/podrida.jpg'); width: 640px; height: 480px; margin: 10px; " title="No carga primero y sí carga segundo background. Muestra segundo." ></div>
</body>
</html>