it-swarm.com.de

CSS-Hintergrundbild wird nicht angezeigt

Ich habe eine HTML-Datei mit einem Unterverzeichnis namens img mit einem Bild namens debut_dark.png. In meiner CSS-Datei habe ich:

body { 
    background: url(/img/debut_dark.png) repeat 0 0;
}

Die HTML-Datei hat das body-Tag und enthält die CSS-Datei entsprechend. Ich weiß sicher, dass die CSS-Datei ordnungsgemäß enthalten ist, da alles andere ordnungsgemäß formatiert ist.

Das Hintergrundbild wird nicht angezeigt, ich sehe nur einen weißen Hintergrund. Irgendwelche Ideen, wie man das behebt oder sogar debuggt?

20
darksky

Je nach CSS-Dateipfad gehe ich davon aus, dass es sich im selben Verzeichnis wie Ihre HTML-Seite befindet. Sie müssen url wie folgt ändern:

body { background: url(img/debut_dark.png) repeat 0 0; }
14
SaidbakR

Sie sollten so verwenden:

 Karosserie { 
 Hintergrund: URL ("img/debut_dark.png") Wiederholung 0 0; 
 } 

 Karosserie { 
 Hintergrund: URL ("../img/debut_dark.png") Wiederholung 0 0; 
 } 

 Karosserie { 
 Hintergrundbild: URL ("../img/debut_dark.png") Wiederholung 0 0; 
 } 

oder versuchen Sie, CSS-Regeln mit dem Firefox Firebug-Tool zu überprüfen.

11
Surinder ツ

Stellen Sie sicher, dass Ihr Körper eine Höhe hat, zB:

body { 
    background: url(/img/debut_dark.png) repeat;
    min-height: 100%;
}
3
David Hellsing

Ich habe das gleiche Problem. Aber es funktioniert gut für mich

background: url(../img/debut_dark.png) repeat
3
Peter Focus

Ich weiß, dass dies nicht den genauen Fall des OP anspricht, aber für andere, die von Google kommen, vergessen Sie nicht, display: block; basierend auf dem Elementtyp zu versuchen. Ich hatte das Bild in einem <i>, aber es erschien nicht ...

3
daniel.caspers

Es ist immer gut, diese zusätzlichen Eigenschaften zusätzlich zu haben 

hintergrundbild: URL ('Pfad') keine Wiederholung 0 0;

  1. bemaßung für das Element festlegen

    breite: x; Höhe: y;

  2. hintergrundgröße: 100%

    • Diese Eigenschaft hilft, das Bild an die obige Dimension anzupassen, die Sie für ein Element definieren.
1
Jay

Sie müssen einen relativen Pfad in der URL verwenden. Ich glaube, Sie haben zwei Ordner in dem Stammverzeichnis erstellt, in dem sich Ihre index.html befindet. Einer ist 'CSS' Ordner und ein anderer ist 'Img' Ordner. 

Nun, wenn Sie auf den Ordner "img" in den CSS-Dateien zugreifen müssen. Sie müssen also einmal im Stammverzeichnis mit der Syntax "../" zurückgehen. Wechseln Sie dann mit der Syntax "../img" in den Ordner "img". Dann schreibe den Bildnamen "../img/debut_dark.png". 

1
ANIL PATEL
body { 
        background: url("../img/debut_dark.png") no-repeat center center fixed;
    }

Arbeitete für mich.

1
Daiana

Ich hatte das gleiche Problem. Bei mir hat es geklappt mit:

  background: url("../img/green.jpg") no-repeat center bottom/cover;
  height: 100vh;
0
Eduard

Nun, ich habe herausgefunden, dass dieses Attribut ein Bild anzeigt, wenn der vollständige Ort darin enthalten ist. Ich habe dieses Bild einfach auf meinen Server hochgeladen und die Position des Bildes im Hintergrundbild verlinkt: url ("xxxxx.xxx"); Attribut und es hat endlich funktioniert, aber wenn Sie keinen Server haben, versuchen Sie, den vollständigen Ort des Bildes in das Attribut einzugeben, indem Sie die Eigenschaft dieses Bildes aufrufen. Ich habe dieses Attribut zwar im Tag einer HTML-Datei verwendet, aber es funktioniert sicherlich auch mit CSS-Dateien. Wenn diese Methode nicht funktioniert hat, versuchen Sie, Ihr Bild im Internet wie behance, facebook, instagram usw. hochzuladen, das Bild zu überprüfen und diesen Ort in Ihr Attribut zu kopieren 

0
Praks

Wenn Ihr Pfad korrekt ist, haben Sie meines Erachtens kein Element in Ihrem Körperteil. Definieren Sie einfach die Körpergröße und Ihr Code wird funktionieren.

0
Aman Jha

Ich verwende eingebettetes CSS auf einem lokalen Computer. Ich habe die Datei atom.jpg im selben Ordner wie meine HTML-Datei abgelegt, dann hat dieser Code funktioniert:

background-image:url(atom.jpg);
0
user3216740

Ich hatte das gleiche Problem, nachdem ich den Wiederholungsabschnitt 0 0 entfernt hatte, wurde mein Problem gelöst.

0
Prakash Poudel