nicht angemeldet
doppelter Farbverlauf?
Guten Morgen!
Ich versuche gerade einen doppelten Farbverlauf als Hintergrund zu erstellen. Habe also 2 Grafiken (einmal (1) hell -> dunkel und dann (2) dunkel -> hell), möchte die eine (1) am oberen Rand platzieren (repeat-x), darunter durchgehend eine Farbe (background-color:XYZ). Das klappt.
Nun soll die Farbe durch Grafik (2) nach unten wieder auslaufen. Geht das? Wenn ja, wie?
Am liebsten wäre mir ja wenn der Effekt von allen 4 Seiten käme (die Farbe zur Mitte hin immer dunkler werden würde).
Die einzige Möglichkeit die mir bis jetzt eingefallen ist wäre sich _ein_ entsprechendes Bild zu basteln und als Hintergrundgrafik zu hinterlegen. Problem: Grafik muss sehr groß sein, damit es nicht irgendwann verpixelt. Falls das die einzige Lösung ist: welches Datei-Format und welche Größe (in px, ca.) empfehlt ihr?
Hat jemand eine Idee, ob/wie das möglich ist? Oder kann mir eine Seite nennen (wenn man danach sucht findet man so etwas ja eh nicht) wo das Anwendung findet?
Schönen Gruß,
Adda
-
Shalom!
Ich versuche gerade einen doppelten Farbverlauf als Hintergrund zu erstellen. Habe also 2 Grafiken (einmal (1) hell -> dunkel und dann (2) dunkel -> hell), möchte die eine (1) am oberen Rand platzieren (repeat-x), darunter durchgehend eine Farbe (background-color:XYZ). Das klappt.
Nun soll die Farbe durch Grafik (2) nach unten wieder auslaufen. Geht das? Wenn ja, wie?Mit CSS3 wäre das kein Problem, weil damit ein Element mehrere Hintergrundbilder haben können wird. Momentan mußt Du die 2 Hintergründe aber noch 2 verschiedenen Elementen geben.
Was hat denn Dein Element für Kindelemente? Vielleicht ist da ein geeignetes bei. Ich habe mal so etwas ähnliches gemacht, die Strukur sah ungefähr so aus:<div id="content"> <h1>Überschrift</h1> <p>Blabla</p> <p>Blabla</p> <p>Blabla</p> </div>In diesem Fall bot sich die Überschrift für den oberen Verlauf an und das div-Element für das andere Hintergrundbild. Daß der Verlauf oben höher war als die Überschrift aussehen sollte, war kein Problem: Das h1-Element bekam einfach eine negative margin-bottom.
Am liebsten wäre mir ja wenn der Effekt von allen 4 Seiten käme (die Farbe zur Mitte hin immer dunkler werden würde).
Könnte auch klappen, wenn die p-Elemente in meinem Beispiel noch mithelfen. ;-)
Die einzige Möglichkeit die mir bis jetzt eingefallen ist wäre sich _ein_ entsprechendes Bild zu basteln und als Hintergrundgrafik zu hinterlegen. Problem: Grafik muss sehr groß sein, damit es nicht irgendwann verpixelt. Falls das die einzige Lösung ist: welches Datei-Format und welche Größe (in px, ca.) empfehlt ihr?
Die Browser skalieren im allgemeinen aber auch nicht besonders schön runter. Ich kann mir vorstellen, daß der Verlauf dann nicht mehr so richtig verläuft und damit unprofessionell aussieht - aber das müßtest Du ausprobieren.
Viele Grüße vom Længlich
-
Hallo,
Am liebsten wäre mir ja wenn der Effekt von allen 4 Seiten käme (die Farbe zur Mitte hin immer dunkler werden würde).
Könnte auch klappen, wenn die p-Elemente in meinem Beispiel noch mithelfen. ;-)
die Frage dabei wäre auch so
[img:http://img292.imageshack.us/img292/6789/35083094ip8.jpg]oder so
[img:http://img240.imageshack.us/img240/4137/34174973yj1.jpg]Grüße, Matze
-
Hallo,
sorry, falscher Code. So gehts:
die Frage dabei wäre auch so
oder so
Grüße, Matze
-
Ngauthaan-thirr!
die Frage dabei wäre auch so
Das würde ich in acht Bilder zerlegen (vier Seiten und vier Ecken); die Problemstellung ist dann sehr ähnlich wie die immer wiederkehrende mit den runden Ecken (ohne border-radius, natürlich). Man muß 8 Elemente finden, die die Hintergründe übernehmen können... schwierig. Zur Not geht's natürlich mit entsprechend vielen verschachtelten divs, aber das wollte ich bewußt nicht empfehlen. Div-Suppe ist nur der allerletzte Notbehelf, _nach_ der Überlegung, ob es denn wirklich unbedingt so aussehen muß.
oder so
Dazu fällt mir jetzt gar nichts anderes ein als ein gestrecktes Bild, wenn es wirklich rund sein soll. Wenn es ein Rechteck mit abgerundeten Ecken werden darf, siehe oben. ;-)
Viele Grüße vom Længlich
-
-
-
-
Hi Adda!
Du hast ja schon einige Tips bekommen. Aber evtl. willst du es ja noch einfacher haben. Wie wäre es denn, ein Hintergrundbild (auf dem ein beliebiger Farbverlauf ist) auf 100% zu strecken? Den Code dafür findest du bei < http://www.htmlite.com/faq022.php>.
Grüsse,
Richard