•  21-09-2019
  •  | 
  •  

Frage

enter image description here

Bitte schauen Sie sich den oben genannten Screenshot an, ich möchte ein Bild mit schwarzem Hintergrund zentrieren, aber ich bekomme einen weißen Raum unten. Bitte könnte mir jemand helfen, dies zu beheben.

CSS

.bgimg {
    background: url('../images/GBS-Chronicle-Background-1.png') black no-repeat center;
}
div#cont {
    height: 672px;
}

Html 

<body class="bgimg">
<div id="doc2">
    <div id="hd"></div>
    <div id="bd">
        <div id="cont">
            <div class="middle">
                <p> hi hello </p>
            </div>
        </div>
    </div>
    <div id="fd"></div>
</div>
War es hilfreich?

Lösung

Versuchen Sie Folgendes hinzuzufügen:

html,body { height:100%; }

Andere Tipps

Versuchen Sie, einzustellen height:100%; auf Ihrem .bgimg Klasse.

Bearbeiten: Möglicherweise möchten Sie auch einstellen padding:0;margin:0; zu deinem .bgimg Klasse auch, nur um sicherzugehen.

Ich denke, GBS-Chronicle-Background-1.png ist nicht hoch genug. Sie können Schwarz entweder Hintergrundfarbe hinzufügen oder das Bild zusammen mit Y wiederholen.

Versuchen Sie, die Reihenfolge Ihrer Hintergrundregel zu ändern, damit die Farbe an erster Stelle steht.

background: black url('../images/GBS-Chronicle-Background-1.png') no-repeat center;

Versuchen Sie dies auch (wie oben vorgeschlagen):

Körper {Farbe:#000000;}

Außerdem: Ich würde vorschlagen, die Höhe Ihres Inhaltsdivs zu kommentieren. Und/oder die BKG-Farbe des Inhaltsdivs auf die gleiche Farbe wie der Körper festlegen. Ich hoffe, das hilft! :)

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top