0

Estoy intentando poner una imagen de fondo para el layout de un nav, pero al pasarle la imagen mediante la propiedad "background-image" no me aparece la misma y salta el siguiente error en consola:

GET http://127.0.0.1:5500/IMG/casita-en-mar-del- 
sur.jpg 404 (Not Found) 

Obviamente me está diciendo que no encuentra la imagen, pero no entiendo el por qué si la ruta que especifico es la correcta.

HTML:

<header class="header">
    <div class="contenedor contenido-principal">

    </div>
</header>

SCSS:

.contenido-principal {

background-image: url(../../IMG/casita-en-mar-del- 
sur.jpg);
background-repeat: no-repeat;
width: 100%;
height: 10rem;

}
2
  • 1
    No será que la URL del background-image está recortada con un salto de línea?... prueba que esté todo en 1 línea... ya que eso sería lo mismo que ../../IMG/casita-en-mar-del- sur.jpg Commented el 23 feb. 2023 a las 13:35
  • Hola! Gracias por sus respuestas. Ahí me fije pero el saltó de línea lo puse por acá solamente, en el código original no estaba. Igual probé borrando y reescribiendo la URL varias veces corroborando que no haya ningún salto de línea ni nada pero sigue ocurriendo lo mismo. Es más, cuando intento poner la misma ruta pero a través de HTML si me toma la imágen JPG. (No así con .avif o .webp, otro problema al cuál le estoy buscando solución). Commented el 23 feb. 2023 a las 13:55

1 respuesta 1

0

Tal y como se indica en el error 404, la ruta de la propiedad background-image está llevando a una imagen que no existe en el enlace. Lo más probable es que esté fallando porque hay un salto de línea entre del- y sur.jpg.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.