0

tengo un problema con la propiedad "background-image" desde mi archivo css

<!DOCTYPE html>
<html lang="ES">
<head>
 <title></title>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0, 
 shrink-to-fit=no">
 <link rel="stylesheet" type="text/css" href="css/Estilos.css">     
</head>
<body>

<div class="Fondo">
</div>

</body>

y este es mi css

.Fondo{
  background-image: url(img/Fondo_Error.png);
  border: 2px solid black;
  height: 150px;
  }

desde el css el background-image no me funciona pero si lo pongo dentro de la etiqueta, recién me funciona.

<div class="Fondo" style="background-image: url(img/Fondo_Error.png);">

</div>

Cabe resaltar que el border y height si me funcionan desde el css.

2
  • Tienes los estilos en una carpeta llamada css, luego si llamas una imagen desde el css, tienes que hacerlo añadiendo ../ a la ruta, mientras que si lo haces desde el raíz, si está en el sitio correcto.
    – track3r
    el 28 abr. 2018 a las 22:27
  • Muy amable ya me funciono , gracias el 28 abr. 2018 a las 22:32

1 respuesta 1

2

El archivo Estilos.css está en una carpeta llamada css, y el HTML esta en un directorio arriba del directorio CSS, con lo cual si pones en el CSS que la imagen de fondo va a ser una imagen que esta en el mismo directorio que el Estilos.css.

Tendrías que poner el siguiente código en tu CSS:

.Fondo{
    background-image: url(../img/Fondo_Error.png);
    border: 2px solid black;
    height: 150px;
}

Ya que le estás indicando que la imagen Fondo_Error.png está en el directorio img, pero un directorio arriba de el directorio css.

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