Tutorial Skript

Tutorials von Thomas Frei-Herrmann

Hintergrund Bild an Browser anpassen Skript

Verkleinere das Browser-Fenster, indem Du es zusammen schiebst, um den Effekt zu sehen.

Hintergrundbild "Mittelmeer-Abendrot-Inseln" von bilder.n3po.com


Hier erstellt mit NOF 12 und der HTML-Ausgabe XHTML. Vielen Dank für den Hinweis auf dieses Skript an Zappe

http://it-runde.de/7788/hintergrundbild-passt-sich-an-browsergrose-an-css-3

Vergesst nicht, das Bild zunächst in Euer Verzeichnis “images” zu kopieren. Der relative Pfad (hier mit 2 Punkten von einer Unterseite) müsste auf der Startseite nur 1 Punkt haben, also dann
./assets/images/DeinHintergrundbild.jpg
oder setzt anstelle dessen die absolute URL ein: http://www.DeineDomain.de/assets/images/DeinHintergrundbild.jpg


> auf Layout klicken > Fenster “Layout-Eigenschaften” > Button “HTML” > Skript “Zwischen Head Tags” einfügen und fertig
 

<style type="text/css">
html {
        background: url(../assets/images/DeinHintergrundbild.jpg) no-repeat center center fixed;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
}
</style>

Wenn Ihr das auf allen Seiten Eures Projektes haben wollt, dann könntet Ihr das Skript auch in die “Master-Rahmen-HTML” einbringen. Achtet dann wieder auf die korrekte relative Pfadangabe und gebt der Startseite (mit 1 Punkt) einen anderen Master-Rahmen-Namen oder verwendet die absolute URL.
Achtet darauf, dass Euer Hintergrundbild eine ausreichende Größe hat - mindestens 1280 Pixel oder größer, denn ältere IE füllen den Bildschirm nur bis zu der maximalen Breite des Bildes.

diese Seite weiter empfehlen



Counter Statistik