Vertikal strecken Hintergrundbild

Ich versuche herauszufinden, wie ein Hintergrundbild vertikal zu strecken. Ich bin mit CSS3 mit 3 Bildern auf folgende Weise:Vertikal strecken Hintergrundbild

background-image: url("left.png"), url("right.png"), url("center.png") 
background-repeat: no-repeat, no-repeat, repeat-x 
background-position: top left, top right, top

Jetzt will ich, um diese Bilder strecken vertikal, dass sie auf den Boden den ganzen Weg erstrecken. Gibt es eine Möglichkeit, dies zu tun?

Quelle

2012-10-02 user1539137

Ich glaube nicht. Sie können die Größe ändern (dehnen/quetschen) '' Tags, obwohl: die Lösung kann beinhalten, setzen Sie eine '' in den Hintergrund, positioniert absolut und so. – KRyan

Dies könnte ein guter Ort sein, um zu schauen: http://stackoverflow.com/questions/1150163/stretch-and-scale-a-css-image-in-the-background-with-css-only – MikeB

Auch Ziemlich sicher, dass du deine "URLs" nicht in Anführungszeichen setzen sollst. – KRyan

Versuchen:

background-size: 100% 100%;

ersten 100% ist für die Breite und die zweite für die Höhe. In Ihrem Fall müssen Sie den zweiten Satz zu 100%

Quelle

2012-10-02 16:45:52

Wie stelle ich die Höhe einfach auf 100% ein? Wenn ich background-size: 100% mache, werden Breite und Höhe auf 100% gesetzt. – user1539137

Das war ziemlich praktisch. In meinem Fall setze ich "background-size: 960px 100%;" um den gewünschten Effekt zu erzielen. –

Ich bin spät zur Party hier, aber das ist was für mich gearbeitet:

background-size: auto 100%;

Dies paßt das Bild vertikal und lassen Sie die Breite tun was auch immer es muss tun (ich denke, es wiederholt sich standardmäßig). Sie können auch festlegen:

background-repeat: no-repeat;

für das Bild in der horizontalen Richtung nicht zu wiederholen.

Quelle

2013-11-18 19:48:28

Ich musste auch 'background-position: center;' – KIC

Eine willkommene Ergänzung der Party, aber spät. – McNab

'Hintergrund-Größe: Cover;' ist es wert, zu erkunden –

Vertikal strecken Hintergrundbild

Antwort

Verwandte Themen