Hallo
Wie meintest du das mit dem Hintergrundbild?
Also die Vorgabe ist: Das bild soll die gesamte Seite ausfüllen ohne einen Farbübergang.
Danach sieht's ja auch aus. Ein Werbeprospekt im Netz. Allerdings mit dem Manko der Verzerrung des Gesichts. Beim Farbverlauf fällt das natürlich nicht so auf. Allerdings ist so ein Browser eben kein DTP-Programm, sprich, du kannst nicht von einer festen Auflösung ausgehen. Ganz offensichtlich bereitet dein Versuch, das zu umgehen, Probleme.
Ich habe das mit css folgendermaßen versucht zu lösen, leider ohne Erfolg:
Das Bild nehmen und fix unten links platzieren.
Dann ein 1px breiten Ausschnitt rechts drangehängt und repeat x.
Dann ein 1px hohen Ausschnitt oben dran und repeat y.
Zwischen dem Bild unf den 1px Bilder-Ausschnitten vom Original entsteht ein mit nicht nachvollziehbarer Farbwechseln. Obwohl der Ausschnitt aus dem Originalbild genommen wurde, sind die Farben auf der Homepage dann nicht gleich.
Irgendwelche Falschpositionierungen?
Hab lang daran rumgebastelt und es einfach nicht hinbekommen, wäre aber für einen Tipp immer zu haben. Wie kann ich es anstellen, dass die Bilder im Web identlisch dargestellt werden (in Photoshop haben sie ja die selben Farben).
Mal davon abgesehen, dass der Quelltext der Seite recht unübersichtlich ist, ließe sich das recht einfach bewerkstellingen. Du brauchst einmal den Farbverlauf als schmaler Streifen, den du dem <body> zuweist. Dann brauchst du noch das Bild des Gesichts als freigestelltes PNG mit Alphatransparenz. Also _nur_ ihr halbierter Kopf ohne Hintergrund und Farbverlauf.
Gegeben sei folgender HTML-Quelltext (Ausschnitt):
<body>
<div id="Background_Picture">
</div>
</body>
</html>
Der CSS-Code kann folgendermaßen aussehen:
html,body {
width:100%;
height:100%;
margin:0;
padding:0;
}
body {
background-image:url("background.png");
background-position:left top;
background-repeat:repeat-x;
background-color:#557284;
}
div#Background_Picture {
height:100%;
width:100%;
background-image:url("hera.png");
background-position:left bottom;
background-repeat:no-repeat;
}
* html div#Backgroung_Picture {
}
Ist das Gesicht sauber freigestellt, wird nicht auffallen, dass es zwei Bilder sind, außer man verändert die Größe des Browserfensters. Das Portrait muss, so wie es aufgenommen ist, unten positioniert werden. Wird das Browserfenster mit geringer Höhe "betrieben", ist die gute Frau halt nicht in voller Höhe zu sehen. Ansonsten kann man natürlich auch darüber nachdenken, ob das Portrait 700px hoch sein muss.
Damit sollte _dieses_ Problem als gelöst gelten.
Tschö, Auge