"Schatten" um zentrierte Webseite

Status
Nicht offen für weitere Antworten.
Precog

Precog

Erfahrenes Mitglied
Hi,

ich bin gerade dabei, eine Webseite zu gestalten, deren Inhalt in einem "Container" in der Mitte des Browser-Fensters zentriert ist (feste Breite, vllt 800). Der Container liegt auf einem Hintergrundbild, das gekachelt dargestellt wird (ein Muster, im <body> definiert). So weit so gut. Nun möchte ich aber, dass der Container einen schwarzen "Schein nach außen" (um mal die PS-Begriffe zu gebrauchen) hat. Oder anders: Von dem Container aus geht ein kurzer Verlauf von schwarz nach transparent in jede Richtung (auch nach oben).

Weiß jemand, wie man so etwas realisieren kann?

Danke für Anregungen!
 
ja, danke.

Ein einfacher drop-shadow auf weißem bg wäre auch kein Problem. Nur, wie gesagt, ich habe ein Hintergrundbild. Das heißt, ich müsste in dem Bild, das ich als "shadow"-Datei verwende, einen schwarz -> transparent Verlauf speichern können. Correct me if I'm wrong, aber soweit ich weiß kann man selbst mittels gif nur entweder 100% transparent oder 100% farbe speichern.

Ist folgendes machbar (und empfehlenswert)? Ich speicher mein Hintergrundbild (Muster inkl Schein nach außen) als "Balken", der - sagen wir mal - 1600px breit ist und vertikal die Höhe des Musters hat, ab und auch nur in y-Richtung wiederholt wird. Er wird dem <body> zugewiesen und zentriert dargestellt.
Da meine Seite aber nicht direkt oben auf Höhe 0 anfängt und über dem Inhalts-Container auch ein schwarzer Schein nach außen zu sehen sein soll, erstelle ich einen <div> mit fester Breite, zentriert, mit der Höhe des bg-Musters und als Hintergrundbild wieder einen Balken, ca. 850px breit, mit dem "Schein nach oben" über dem bg-Muster. Das gleiche am unteren Ende der Seite.

Macht das irgendwie Sinn?^^ Wenn es nicht verständlich ist, mach ich nochmal eine kleine Erklärungsgrafik.

Weiterhin ist jedoch jeder Ratschlag in jede Richtung willkommen.

Danke.

PS: Ich meine ungefähr soetwas:
http://www.claraluz.pro.br/index.php?pg=pages&id=11
Ein "Schein nach Außen" über einem Muster. Leider weiß ich nicht wie es hier realisiert wurde, scheint Javascript zu sein. Vielleicht versteht ein etwas versierterer Mensch als ich hier die Umsetzung? ;) (Und kann sie vielleicht sogar erklären?)
 
Also ich würde das in PS machen, einfach die komplette Seite was grafisch sein soll, erstellen, als PNG abspeichern.
Natürlich vorher einzelne Bereiche machen(Head, Main, Boddem).
und den Hintergrund wie du schon sagtest wiederholen im Body.
Versuch die Grafiken so gering wie möglich zu halten sonst sind die Ladezeiten zu hoch.
mfg
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück