Imagen de fondo en <img> elemento

¿Alguien me puede ayudar a encontrar mi problema? Tengo <img /> y le daré una imagen de fondo dentro de una etiqueta <a>.Imagen de fondo en <img> elemento

Aquí está mi ejemplo:

<img border="0" style="display:block; width:20px; height:20px; background-color:red; padding:9px; background:url(\'./images/system/button/close/close.png)\' no-repeat" />

background-color no funcionó a .. :-(Mi ejemplo es una cadena de JavaScript, esa es la razón por la que estoy escapando la URL

Gracias por su ayuda :-)

Fuente

2010-10-19 Patrik

¿Por qué escapa de las citas? ¿Estás seguro del '.' principal de la URL? –

a menos que esté extremadamente confundido, ¿por qué está ajustando el BG de una etiqueta img sin hacer uso de su atributo SRC? y el './' inicial en la url es solo una ruta relativa, creo – Ross

¿Por qué no utilizar el atributo src? ¿Por qué necesitas usar background-image? – jerjer

ni siquiera necesita las comillas.

background:url(./images/system/button/close/close.png)

usar un div si se puede

<div style="height:20px; width:20px; padding:9px; background:url(./images/system/button/close/close.png) no-repeat red"></div>

Fuente

2010-10-19 10:27:29

tenga en cuenta que los divs se muestran de forma predeterminada como imagen de bloque en línea – jerjer

También es de destacar que su color de fondo no funciona porque lo está superando más allá. O haga 'background: red url (...)' o use 'background-image' en su lugar. –

¿Por qué 'usar un div si puedes'? Sin duda, un elemento de imagen tiene más sentido semántico si el propósito del elemento es mostrar una imagen –

Está escapando de las comillas y ha transpuesto la segunda comilla y el corchete.

En CSS:

url('foo') /* is technically fine but broken on IE/Mac */ 
url(foo)  /* is fine */ 
url('foo)' /* is not fine */ 
url(\'foo\') /* is not fine */

Y como señala Ross en un comentario, su atributo src no se encuentra. Imagino que el ajuste de una imagen de fondo en una imagen con fondo translúcido funcionará, pero si no tiene una imagen de contenido, no use un elemento <img> (y no oculte ninguna imagen de contenido que tenga en background-image propiedades).

Fuente

2010-10-19 10:26:06 Quentin

Lo siento, me olvidé de decir que es mi cadena de JavaScript ... – Patrik

¿Qué elemento está calificado para usar una Imagen con fondo dentro de una etiqueta ? – Patrik

No entiendo por qué está escapando de las comillas.

<img border="0" style="display:block; width:20px; height:20px; background-color:red; padding:9px; background:url('./images/system/button/close/close.png') no-repeat" />

¿Eso funciona?

Y de seguro. en la URL?

Fuente

2010-10-19 10:26:56

Como es una cadena de JavaScript – Patrik

Bueno, aunque es raro utilizar la etiqueta <img/> para esto. (No es su propósito, utilizar src o una div con el fondo ...)

Here, está funcionando

Fuente

2010-10-19 10:35:28 Shikiryu

background-color:red; está siendo reemplazado por background:.

Combine sus fondos. Luego puede refinarlo aún más eliminando las comillas en la URL() del fondo y el período de la URL. si es relativo a la ubicación de la página en la que se encuentra, simplemente elimine la barra diagonal inversa.

<img border="0" style="display:block; width:20px; height:20px; padding:9px; background:#F00 url(images/system/button/close/close.png) no-repeat" />

pasado si necesita tener una alt atribuir su contenido se mostrará ya no hay una fuente. Use una imagen transparente si agrega el alt.

Fuente

2017-06-21 15:45:05 chaiboy

Imagen de fondo en <img> elemento

Respuesta

Cuestiones relacionadas