html - farbverläufe

PC FREAKY

Commander
Registriert
März 2010
Beiträge
2.250
Hallo,

Was für eine Möglichkeit gibt es denn um in einer Homepage einen Farbverlauf oben einzufügen?

Ich meine so etwas wie cb am anfang hat.

Die homepage ist z.T. 10k Pixel hoch, deswegen möchte ich kein .png bild als hintergrund nehmen, da dieses beim scrollen immer nachlädt und ich somit weiße Hintergründe habe...

Wie kann ich das realisieren?

der verlauf soll ca. 700 Pixel hoch sein und von dunklem zu hellem grau gehen...
wenn der verlauf vorbei ist, soll der rest das helle grau sein.

wie realisiert man sowas?

danke schonmal,

PC FREAKY
 
Das ist nur "getrickst". Die Hintergrundfarbe setzt du einfach, wie z.B. CB #71A4D5
Code:
background: url("/design/background.png") repeat-x scroll 0 0 #71A4D5;
und da siehst du auch schon, dass der anfängliche Verlauf einfach nur eine Grafik ist, die nach unten hin an Deckkraft verliert. Diese wird per repeat-x über die ganze Breite gezogen.

Grafik sieht auf CB so aus: https://www.computerbase.de/design/background.png
 
Ja i.d.R. wird soetwas mit Hintergrundbildern gelöst, aber es geht auch anders.

Z.B. ganz viele div felder ohne rahmen, padding und margin unter einander und allemit verschiedenen farben. Ist aber die wohl schlechteste Variante, da lieber ein Bild.

Alternativ gibt es aber noch CSS3 ! Das kann Farbverläufe ich allen Variationen und eigentlich alle aktuellen Browser unterstützen das schon. Bei Älteren leider nicht, alos muss man abwiegen was für die besser ist und ob die "alten" entweder als alternative ein Bild zu sehen bekommen oder aber schlicht einen weißen HIntergrund.

Hier noch ein Artikel zu CSS 3 background-gradient:
http://blog.marit.ag/2010/05/04/teaserboxen-mit-verlauf-ohne-bilder-css3-linear-gradient/
 
Zurück
Oben