Schatten in CSS oder Javascript
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
apollo
auswahl
background
beitrag
bild
bingo
echten schatten
farbe
funktion
gen
hintergrund
hintergrundfarbe
image
recht
schatten
schrift
transparenz
trickkiste
versehen
zeitschriftenartikel
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Du kannst mit border-left und border-bottom einen 0815-Schatten erzielen. Aber rumdrum geht mit CSS ned.
-
Aber das w?r doch nur en border?
-
soweit ich wei? kann man mit der neuesten CSS-Version auch einen Text mit einem Schatten evrsehen...ich suche den Zeitschriftenartikel mal raus, in dem ich das gelesen habe...leider wird diese Funktion noch nicht von allen Browsern unterst?tzt....
Eine Alternative w?re, den Schatten als Grafik zu erstellen und per CSS als Hintergrundgrafik anzeigen zu lassen...Nachteil: wenn das Element dann mit einem Rahmen versehen wird, ist der Schatten innerhalb des Rahmens -
Also ich habe schon leider einen Background! Deswegen brauch ich irgendnen script!....
-
Oder du definierst das Schattenbild absolute und setzt es dann mit z-index hinter den "Schattenwerfer"
-
Und wie?^^
-
nicht das goldene vom ei aber vielleicht reichts:
http://www.css4you.de/trickkiste/tr00024.html
mfg apollo13 -
das ist eine gute Idee und geht auch ganz einfach.
Nehmen wir mal an du hast einen div-Container. Dieser soll einen Schatten bekommen.
Dann stellst du im Stylesheet des Divs eine absolute Position ein und f?gst folgende Angabe hinzu:
z-index:2;
dann erstellst du einen zweiten Div, mit den selben Ma?en und mit einer leicht nach rechts unten (oder wo auch immer) verschobeben Position und der Hintergrundgrafik mit dem Schatten.
Du kannst nun optional im Stylesheet dieses divs
z-index:1;
einf?gen, musst du aber nicht unbedingt.
Wenn du nun den oberen Div-Conatiner noch halbtransparent machst, sieht das bestimmt genial aus!
Transparenz? steht hier:
http://www.css4you.de/trickkiste/tr00018.html
Gru?
ssd
?dit: zu lahm. na ja, bei mir ist als einziger Unterschied zu apollo eine HGgrafik statt dunkler Hintergrundfarbe drin....
Beitrag ge?ndert am 26.08.2005 18:38 von ssd_bonn -
M?ll?
Bin zu dumm daf?r *reusper*
Kannste mir das mal in ner HTMLdatei zeigen^^ Oder gehts noch einfacher? -
jap wie in meinem link beschrieben ....
mfg apollo13 -
Sry habs gecheckt^^
Ne das ist echt nicht das gelbe vom ei!!
Wollte das mit nem verlaufsschatten...
Eben wie ein richtiger schatten aussieht!
@apollo
In deinem Ava steht ja born to frag
Ist da das fragen gemeint
oder das fraggen?^^
Beitrag ge?ndert am 26.08.2005 18:51 von sneppa -
glaube nicht dass das geht, denn dann m?sstest du eine virtuelle lichtquelle erstellen usw. , mit css gehtd das sicher nicht!!
javascript glaube ich eigentlich auch nicht, da es sicherlich komplexe berechnungen w?ren .....
also schlag dir deinen echten schatten aus dem kopf
mfg apollo13 -
Will ich aber nich^^
Niemand irgendeine Idee?^^ -
ichichichichichich
na klar geht das mit css...gesetzt den Fall, du hast eine Hintergrundgrafik in der richtigen Gr??e....da kannst du mit Verl?ufen und Schlagschatte spielen, wie du willst!
Du musst eionfach nur in dem HTML-Code den Apollo oben verlinkt hat im unteren div die Grafik als Hintergrund einbinden... -
Genial^^ blo? wie mach ich dann ein ende?
-
sneppa schrieb:
Genial^^ blo? wie mach ich dann ein ende?
hmm ich habe gerade das Gef?hl wir reden aneinander vorbei
ich gehe davon aus, du erstellst als Schatten eine komplette Grafik!
in etwa so:
http://ssd_bonn.xardas.lima-city.de/images/schattenverlauf.jpg
geht ganz einfach:
Photoshop, bild in entsprechender Gr??e erstellen
Auswahlrehteck aufziehen
auswahl->auswahl ver?ndern->abrunden-> geeigneten Radius eingeben, z.B. 5 Pixel (oben verwendet)
dann das Verlaufswerkzeug nehmen, Farben einstellen und in der Auswahl einen Verlauf erzeugen.
Dann das Ganze als gif oder png (wegen der Transparenz) abspeichern, fertig.
Jetzt nur noch mit
background:(url(pfad/dateiname.gif);
im Stylesheet als Hintergrund des Divs angeben, fertig....
Gru?
ssd
R?ckfragen etc wie immer gerne -
Ich dachte es geht nur:
bakckground-image:url(pfad/bild.gif);
...
das ist mehr oder weniger egal.
man kann die Hintergrundfarbe zum Beispiel auch so angeben:
background-color:#f0f0f0;
background:#f0f0f0;
das Ergebnis ist bei den meisten Browsern das selbe. Eine Aufschl?sselung, welcher Befeh?l von welchem Browser wie interpretiert wird, gibt es unten auf den Erl?uterungsseiten auf http://www.css4you.de
ssd -
M?ll... Ich kann sehr gut mit PSCS umgehen... aber ich find die l??ung nich gescheit... hier das was ich bei 5minuten googlen gefunden hab:
http://www.thestyleworks.de/tut-art/shadow.shtml
Falls das nicht richtig funzt werd ich nochmal bschd sagen! -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage