CSS-Hintergrund Wiederholen

Question

Gibt es eine Möglichkeit, ein Hintergrundbild zu strecken statt zu wiederholen?

Answer 1

Nicht jede Art von Cross-Browser kompatibel mit CSS (es ist die background-size Eigenschaft jedoch.)

Wenn dies bei jedem Browser insbesondere gerichtet ist, könnte es möglich sein. Sonst müssen Sie einen verwenden und dehnen.

Hier ist, wie Sie es in neueren Browsern tun:

body { 
    background-image: url(bg.jpg); 
    -moz-background-size: 100% 100%;  /* Gecko 1.9.2 (Firefox 3.6) */ 
    -o-background-size: 100% 100%;  /* Opera 9.5 */ 
    -webkit-background-size: 100% 100%; /* Safari 3.0 */ 
    -khtml-background-size: 100% 100%; /* Konqueror 3.5.4 */ 
} 

Andernfalls mit einem <img>:

img#background { 
    /* height: 100%; Note: to keep ratio, don't use height */ 
    left: 0; 
    position: fixed; /* or absolute, if you like */ 
    top: 0; 
    z-index: -1; 
    width: 100%; 
} 

Answer 2

Only in CSS3

Sie ein Bild verwenden könnte und legen Sie seine Breite und Höhe 100%, Z-Index zu -1 Position zu absolut. Das könnte funktionieren.

Answer 3

body 
{ 
background-image:url('smiley.gif'); 
background-repeat:no-repeat; 
background-attachment:fixed; 
background-position:center; 
} 

http://www.w3schools.com/css/css_background.asp

Dies wird Ihr Bild nicht streach, aber es wird das Bild nicht wiederholen machen.

Answer 4

Hintergrundgröße ist CSS3 und wird noch nicht unterstützt. Sie könnten einen Blick auf diesen Artikel werfen: How Do you Stretch a Background Image in a Web Page

Hoffe, das hilft.