✔ Hintergrund in PS für's Web

Status
Nicht offen für weitere Antworten.
Dann schneidest du einmal die Ecken zurecht und dann
den Strahlteil undten Plus oben raus und die graden Flächen
wiederholst du mit "background-repeat:repeat-y;"....
 
Also willst du hier jetzt ne Schritt für Schritt Anleitung
und dabei noch html lernen?! Ich würde sagen du suchst
dir mal ein tut tum sinnvollen Slicen und entsprechender
Umsetzung... Denn sonst gehts dann mit Menü und Inhalten
gleich weiter...
 
xXx_BaSStar_xXx hat gesagt.:
Also willst du hier jetzt ne Schritt für Schritt Anleitung
und dabei noch html lernen?! Ich würde sagen du suchst
dir mal ein tut tum sinnvollen Slicen und entsprechender
Umsetzung... Denn sonst gehts dann mit Menü und Inhalten
gleich weiter...
Zum Vergrößern anklicken....

Ich kann HTML und leider komm ich an diesem Punkt nicht weiter. Aber egal vergisst es einfach. Ich lass den Hintergrund einfach weg.
 
Ah, jetzt lässt sich das Problem etwas besser eingrenzen :) Aber eine Frage vorneweg: Wenn du HTML kannst, warum nutzt du dann Dreamweaver? Immerhin ist das Programm nicht ganz billig.

Die Slices, die du im Screenshot hast, sind im Prinzip schon vollkommen richtig, nur musst du den Hintergrund und den Teil für den Inhalt getrennt voneinander behandeln. D.h. du sliced das Bild mit transparentem Hintergrund. In deinem Fall wirst du wohl auch auf die Verwendung von 24-Bit PNGs nicht herumkommen, da nur dieses entsprechende Transparenzen unterstützt. Da der Himmel eine recht gleichmäßige Färbung hat werden normale PNGs wohl auch noch durchgehen, im Bereich des Kondenzstreifen wird man das aber sehen können.
CSS: 
body { 
    background-image: url( bildmitkachelndemhimmel10x10px.png );
}
div.strahl{
    z-index: 1;
    background-image: url( bildmitkondensstreifen.png );
    background-repeat: no-repeat;
    background-position: 0 0;
}
div.container {
    z-index: 2;
    position: relative;
    top: 20px;
    left: 30px;
}
div.header {
    background-image: url( header.png );
    background-repeat: no-repeat;
    width: BreiteinPX;
    height: HeightInPx;
}
div.content {
    background-image: url( content_spacer.png );
    background-repeat: repeat-y;
    width: BreiteInPx;
}
div.footer {
    background-image: url( footer.png );
    background-repeat: no-repeat;
    width: BreiteinPX;
    height: HeightInPx;
}
HTML: 
...
    <body>
        <div class="container">
            <div class="header">HEADER</div>
            <div class="content">CONTENT</div>
            <div class="footer">FOOTER</div>
        </div>
        <div class="strahl">&nbsp;</div>
    </body>
</html>
Ich denke, dass es so funktionieren müsste. Was ich außerdem empfehlen kann ist, dass du manuell sliced. Ich hab die Erfahrung gemacht, dass ich dadurch ein wesentlich besseres Ergebnis bekomme, vor allem hat man einen wesentlich besseren Einfluss auf den Code.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück