J'ai un fichier HTML avec un sous-répertoire appelé img
avec une image appelée debut_dark.png
. Dans mon fichier CSS, j'ai:
body {
background: url(/img/debut_dark.png) repeat 0 0;
}
Le fichier HTML a la balise body et inclut le fichier CSS de manière appropriée. Je sais pour sûr que le fichier CSS est correctement inclus car tout le reste est correctement formaté.
L'image d'arrière-plan ne s'affiche pas, je ne vois qu'un fond blanc. Des idées comment résoudre ce problème, ou même comment le déboguer?
Selon votre chemin de fichier CSS, je suppose que c'est dans le même répertoire que votre page HTML, vous devez modifier la variable url
comme suit:
body { background: url(img/debut_dark.png) repeat 0 0; }
Vous devriez utiliser comme ceci:
corps { background: url ("img/debut_dark.png") répéter 0 0; } corps { background: url ("../ img/debut_dark.png") répéter 0 0; } corps { background-image: url ("../ img/debut_dark.png") répéter 0 0; }
ou essayez d’inspecter les règles CSS en utilisant l’outil Firefox Firebug.
Assurez-vous que votre corps a une hauteur, par exemple:
body {
background: url(/img/debut_dark.png) repeat;
min-height: 100%;
}
J'ai le même problème. Mais cela fonctionne correctement pour moi
background: url(../img/debut_dark.png) repeat
Je sais que cela ne traite pas le cas exact de l'OP, mais pour les autres utilisateurs de Google, n'oubliez pas d'essayer display: block;
en fonction du type d'élément. J'avais l'image dans un <i>
, mais elle n'apparaissait pas ...
Il est toujours bon d’avoir ces propriétés supplémentaires en plus de la
image d'arrière-plan: url ('chemin') no-repeat 0 0;
définir la dimension à l'élément
largeur: x; hauteur: y;
taille du fond: 100%
Vous devez utiliser un chemin relatif dans l'URL. Je pense que vous avez créé deux dossiers dans le répertoire racine où réside votre index.html. L'un est le dossier 'CSS' et l'autre est le dossier 'img'.
Maintenant, si vous devez accéder au dossier 'img' dans les fichiers css. Vous devez donc revenir une fois dans le répertoire racine en utilisant la syntaxe "../". Déplacez ensuite le dossier 'img' en utilisant la syntaxe "../img". Puis écrivez le nom de l'image "../img/debut_dark.png".
body {
background: url("../img/debut_dark.png") no-repeat center center fixed;
}
Travaillé pour moi.
Eh bien, j'ai compris que cet attribut affichait une image lorsque l'emplacement complet y était indiqué. J'ai simplement téléchargé cette image sur mon serveur et lié l'emplacement de cette image dans l'image d'arrière-plan: url ("xxxxx.xxx"); attribut et cela a finalement fonctionné, mais si vous n’avez pas de serveur, essayez d’entrer l’emplacement complet de l’image dans l’attribut en allant à la propriété de cette image. Bien que j'utilisais cet attribut dans la balise d'un fichier HTML, cela fonctionnera sûrement aussi sur le fichier CSS. Si cette méthode ne fonctionne pas, essayez de télécharger votre image sur Internet, comme behance, facebook, instagram, etc., inspectez-la et copiez-la sur votre attribut. J'espère que cela fonctionnera
J'utilise CSS intégré sur un ordinateur local. J'ai mis le fichier atom.jpg dans le même dossier que mon fichier html, alors ce code a fonctionné:
background-image:url(atom.jpg);
J'avais le même problème, après avoir enlevé la partie repeat 0 0, cela a résolu mon problème.