HTML Hintergrund

Question

Ich versuche, meine Webseite zu machen. Ich habe ein Layout mit Photoshop so effektiv gemacht, es ist eine PNG-Datei.

Meine Frage ist - Wie integriere ich diese in die Website mit HTML/CSS? Ich habe versucht, das CSS zu bearbeiten, was irgendwie funktioniert hat.

body { 
background-image:url('URLAddressHere'); 
} 

Allerdings, wenn ich das Fenster vergrößern, etc, etc ... wird das Bild nur ruiniert. Gibt es eine Möglichkeit, dass der Hintergrund mit der Seitengröße richtig skaliert wird? Außerdem möchte ich, dass es einheitlich bleibt (d. H. Es wiederholt sich nicht) Oder mache ich es einfach falsch? Wie bin ich meinte, dieses ‚Bild‘ zu implementieren, die im Wesentlichen mein Menü hat usw.

Dank

Answer 1

diese

Versuchen:

body { 
    background-image:url('URLAddressHere'); 
    background-repeat:no-repeat; 
} 

Answer 2

Was Sie suchen ist ein css3 Eigenschaft namens Hintergrund- Größe. Dies ändert die Größe des Hintergrunds abhängig von der Breite und Höhe des Browsers. Ich habe unten ein paar Ressourcen verlinkt. Sie müssen die Wiederholung auch ausschalten. Genießen

http://www.css3.info/preview/background-size/

Also für Ihre Klasse können Sie hinzufügen möchten:

background-repeat: no-repeat; 
background-size: cover; 

Answer 3

Ich glaube, Sie so etwas wie dies wünschen werde ....

html { 
    background: url(images/bg.jpg) no-repeat center center fixed; 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/bg.jpg', sizingMethod='scale'); 
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/bg.jpg', sizingMethod='scale')"; 
}