web-dev-qa-db-fra.com

Comment donner le chemin de l'image de fond en CSS?

Mon fichier CSS est dans:

Projet/Web/Support/Styles/file.css

Mon image est dans:

Projet/Web/images/image.png

Je veux cette image dans mon fichier CSS.

J'ai essayé :

1) background-image: url(/images/image.png);
2) background-image: url('/images/image.png');
3) background-image: url("/images/image.png");
4) background-image: url(../images/image.png);
5) background-image: url('../images/image.png');
6) background-image: url("../images/image.png");

Mais. Je ne reçois pas cette image dans ma page.

Quelle est la bonne façon de spécifier le chemin du fichier image dans le fichier css?

htmlcss
44
Jobin

Votre css est ici: Projet/Web/Support/Styles/file.css

1 fois ../ signifie Projet/Web/Support et 2 fois ../ i.e. ../../ signifie Projet/Web

Essayer:

background-image: url('../../images/image.png');
112
Hiral

Il y a deux manières de base:

url(../../images/image.png)

ou

url(/Web/images/image.png)

Je préfère ce dernier, car il est plus facile de travailler avec et fonctionne à partir de tous les emplacements du site (utile aussi pour les chemins d'image en ligne).

Remarquez que je ne ferais pas tellement de dossiers imbriqués en profondeur. Cela semble inutile et rend la vie un peu difficile, comme vous l'avez constaté.

11
ralph.m

Utilisez le ci-dessous.

background-image: url("././images/image.png");

Cela fonctionnera.

7
Nitesh

Vous devez récupérer 2 dossiers à partir de votre fichier css. 

Essayez: 

background-image: url("../../images/image.png");
3
UnderTheSea

La solution ( http://expressjs.com/fr/starter/static-files.html ).

une fois cela fait, le dossier images ne sera plus mis. seulement être

background-image: url ("/ image.png");

carpera que l'image est déjà dans les fichiers statiques

0
lypef