Hintergrund auf ganzen body strecken

  • ich habe folgendes gif so im css (für body) eingebaut:

    background:url(images/background_body.gif) no-repeat left top;

    Wie schaffe ich, dass es auf die gesamte Grösse des body gesteckt wird, also so breit und so hoch wie die ganze seite ist ?

    Im Moment zeigt er es nur links am rand

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Du meinst, dass das Bild auf die gesamte Seite "skaliert", also gedehnt wird? Das geht nicht. Du kannst es nur "kacheln", also wiederholen lassen. Dazu einfach aus dem "no-repeat" ein "repeat" machen.

  • ja genau das meine ich. Schlecht, wenn es nicht geht.
    Wiederholen kann ich es auch nicht, weil dann der Verlauf ja nicht mehr stimmt.

    Was dann ?

    Wäre es möglich, oben, links, rechts und unten eines zu machen ?
    Wenn ja wie geht das ?

  • ich möchte einen kompletten 20px Rand oben links und rechts, unten etwas mehr.
    Es ist ein farbverlaug von dunkelgrau (oben) in "normales" grau unten

    Beispiel: Breaking News | Headline News | Current - New York Post

    Exakt so wie hier, ausser dass die Ränder bei mir rechts und links sind und 20px

    Das mit Java kann ich nicht. Wie kann ich es lösen ?

  • Java != JavaScript!

    Du meinst den grauen Farbverlauf, der da im Seitenhintergrund ist? Einfach den Verlauf als Grafik erstellen. Der Verlauf läuft in eine Farbe (hellgrau) aus, diese ist die Hintergrundfarbe des <body>. Die Grafik selbst ist x Pixel hoch und genau 1 Pixel breit. Die Grafik wird per CSS-Background-Eigenschaft oben links positioniert und dann mit repeat-x horizontal wiederholt. Nach unten läuft die Farbe dann in die Hintergrundfarbe aus.

  • super. Du wirst es nicht glauben, aber ich hatte vorher auch schon an soetwas gedacht
    Weisst du zufällig exakt welche Graufarbe das ist ?

  • Nein, woher sollte ich? Wenn du die Grafik erstellst, dann kennst du doch deine Farbwerte. Ansonsten kann dir jedes Grafikprogramm anzeigen, welche Farbe das Pixel unter dem Cursor gerade hat. ;-)

  • er wiederholt das gif nicht. Habe es jetzt so:

    body{
    background:url(images/background_body_left.gif) repeat-x left top;
    font:62.5% 'Lucida Grande',Verdana,Arial,Sans-Serif;
    margin:0;
    padding:0;
    }

    P.S.: Als die ergänzende Hintergrundfrage dann auch einfach background: farbe; oder ?

  • Einfach bei background mit dazu schreiben:

    Code
    body{
    background:[COLOR="Green"]#cccccc[/COLOR] url(images/background_body_left.gif) repeat-x left top;
    font:62.5% 'Lucida Grande',Verdana,Arial,Sans-Serif;
    margin:0;
    padding:0;
    }


    Hintergrundbilder: Übersicht: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

    So wie du deinen Code angegeben hast sollte er das Bild auch wiederholen.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!