2017-12-23 32 views
-1

Ich mache eine Website, aber ich habe ein Problem mit dem Hintergrund. Ich verwende {background-size: cover;}, damit mein Hintergrund den Bildschirm ausfüllt. Wenn das Hintergrundbild jedoch größer als der Bildschirm ist, können wir nur einen kleinen Teil des Bildes sehen. Ich möchte den Hintergrund auf den Bildschirm einstellen: Ich möchte keine leeren Bilder sehen, aber ich möchte so viel wie möglich von dem Bild sehen. Ich weiß nicht wirklich, was ich suchen soll und ich kann keine Antwort finden, um das zu lösen. Gibt es jemanden, der mir helfen kann?CSS-Problem: Hintergrund größer als Bildschirm

Mit anderen Worten, ich habe mehrere Hintergründe zur Verfügung. Ein zufälliger wird ausgewählt und angezeigt. Daher möchte ich, dass der Hintergrund vollständig auf den Bildschirm passt und weniger von dem Bild, das möglich ist, verliert. Wenn bei der Hintergrundgröße das ausgewählte Bild beispielsweise UHD ist, wird der Hintergrund nur die oberen linken Pixel sein, die dem Bildschirm entsprechen (1920x1080 für mich). Aber ich möchte, dass es der Breite oder der Höhe des Bildschirms entspricht (kleiner, adaptiv), um fast das gesamte Bild anzuzeigen. Hier

ist der Code in der CSS:

body { 
    background: url('https://profuder.com/images/backgrounds/8.jpg'); 
    background-size: cover; 
} 

Dieses Bild ist groß, so dass nur ich die linke obere sehen.

Danke für die Hilfe.

+2

Mögliche Duplikate von [CSS Bildgröße, wie zu füllen, nicht dehnen?] (Https://stackoverflow.com/questions/11757537/css-image-size-how-to-fill-not-stretch) – Daniel

+2

ohne Code, niemand wird Ihnen helfen –

+1

Wenn Sie eigenen Code mit uns teilen w'll versuchen, Ihnen zu helfen –

Antwort

0

Ich löste mein Problem.

Ich weiß wirklich nicht, warum, aber die JavaScript Ich löschte einen zufälligen Hintergrund verwendet, um die anfänglichen

für die Suche nach
background-size: cover; 

in der CSS-Datei.

So habe ich nur

document.body.style.backgroundSize = "cover"; 

kurz nach meinem Code einem neuen Zufall Hintergrund

document.body.style.background = "url('" + randomImage + "') no-repeat 0 0"; 


Vielen Dank für Ihre Hilfe und sorry für die fehlenden Code anzuwenden.

Grüße,
Bastien.

Verwandte Themen