[TYPO3-german] Layout und Rand-Schatteneffekte

Tue Apr 20 15:33:12 CEST 2010

Prinzipiell reichen auch vier Grafiken bzw.
bei fixer Breite ODER Höhe reichen zwei Grafiken,
diese beinhalten dann einfach den Schatten für
eine oder zwei Ecken UND den vertikalen oder
den horizontalen Schatten - dazu müssen sie
aber auch demensprechend hoch/breit sein, damit
auch größere Elemente (dynamische Bereiche)
den Schatten "werfen" können.

Ich glaube diese How-Tos entsprechen mehr
oder weniger dem, was ich versucht habe zu beschreiben:
http://www.ploughdeep.com/onionskin/
http://www.alistapart.com/articles/cssdropshadows/

Grundsätzlich kannst du aber CSS3 verwenden, um in
den modernen Browsern Schatten zu erzeugen (FF3, Safari4, etc.)
und für die älteren kannst du zusätzliche Styles
einbinden (und/oder Javascript) um den Schatten hinzubekommen.

Grüße,
Thomas

Am 20.04.2010 14:48, schrieb Jochen Graf:
> Christian Wolff schrieb:
>> -----BEGIN PGP SIGNED MESSAGE-----
>> Hash: SHA1
>>
>> Am 20.04.2010 13:37, schrieb Jochen Graf:
>>> Hallo,
>>>
>>> ich weiss., es geht hier nicht um Typo3, erhoffe mir aber etwas Hilfe.
>>>
>>> Das Layout hat einen Schattenrand, nun versuche ich schon seit Tagen mit
>>> Gimp oder PSD einen Schatten zu erzeugen.
>>> Leider schlagen bisherige Versuche fehl.
>>>
>>> http://www.typotest11.uni-landau.de/fileadmin/schatten_layout.JPG
>>>
>>> Im Forum bei PSD hatte ich auch nichts finden können.
>>> Kennt jemannd eine Seite, bei der es mal von grundauf erklärt wird?
>>>
>>> "Schatteneffekte"
>>>
>>> Normalerweise bin ich gut im Recherchieren, doch bei diesem Thema kann
>>> ich echt nichts passendes finden.
>>>
>>> Der Schatten sollte später auf dieser Seite angepasst werden.
>>>
>>> http://www.typotest11.uni-landau.de
>>>
>>> Danke
>>
>> Hi Jochen auch wenns nicht hier her gehört.
>>
>> in Photoshop gibts es einen ebenen effekt "schlagschatten"
>>
>> der der das tut was du willst.
>>
>> dazu must du deine "kästen" in einer extra ebene haben. da diese effekte
>> immer die kontur der ebene als basis verwenden.
>> dann klickst du in der ebenen palette die ebene an die den shatten
>> "werfen" soll. dann hast du unteren rand der ebenen palette ein "fx"
>> symbol. dort wählst du schlagschatten aus.
>>
>> alles weitere ist dann ziemlich selbsterklärend.
>>
>> je nach dem wie dein schatten aus sehen soll ist es manchmal auch
>> sinvoll einen "schein nach aussen" zu verwenden. dort must du dann
>> allerdings die füllmethode verändern damit es wie ein schatten wirkt.
>>
>> gruss chris
>>
>> - -- Christian Wolff // Berlin
>> http://www.connye.com
>>
>> some projects:
>> http://richtermediagroup.com | http://titanic.de |
>> http://fairplay-homepage.de
>> -----BEGIN PGP SIGNATURE-----
>> Version: GnuPG v1.4.9 (MingW32)
>>
>> iEYEARECAAYFAkvNlxQACgkQIcCaXPh/JHFciACbBm6AEO+D7v0NPaIAd5+4SNl4
>> uWEAoKOaDlaJL+c8Isntsx3NlEDcvMPF
>> =Q2sJ
>> -----END PGP SIGNATURE-----
>> _______________________________________________
>> TYPO3-german mailing list
>> TYPO3-german at lists.typo3.org
>> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
> Liebe Alle,
>
> ja genau, da bin ich seit zwei Tagen dran PSD "Schlagschatten",
> vielleicht fehlt mir da noch etwas die Übung.
>
> Werde es erst mal mit PSD versuchen., und bei Gimp kenne ich bereits die
> Funktion, aber wie gesagt, ich benötige doch noch etwas mehr Übung.
>
> Da schwierge ist, es sind insgesamt 8 Graphiken die einen Schatten haben
> müssen.
>
> 4 Ecken
>
> 1 mal links
> 1mal rechts
> 1 mal unten
> 1 mal oben
>
> <body>
> <!--###DOKUMENT### BEGIN-->
> <div id="page_aussen">
> *background-image: url(../img/border_left.gif);
> *
> <div id="page">
> *background-image: url(../img/border_right.gif);*
>
>
> *<div id="border-top">
> <div class="obenlinks"> </div>
> <div class="obenrechts"> </div>
> </div>*
>
> <div id="header">Header</div>
> <div id="wrapper">
>
> <div id="Spaltelinks">###SPALTENNAVIGATION###</div>
> <div id="content">###INHALT###</div>
> <div style="clear: both;"></div>
> </div>
> <!--Ende wrapper-->
> <div id="footer">footer</div>
>
> *<div id="border-bottom">
> <div class="untenlinks"> </div>
> <div class="untenrechts"> </div>
> </div>*
> </div></div>
> <!--###DOKUMENT### ENDE-->
> </body>
>
> Danke
>
> - Mit freundlichen Grüssen
>
> Jochen Graf
>
> Universität Koblenz-Landau / Campus Landau
> Arbeitstelle Multimedia/Technik-Administration
>
> Gebäude K, Raum 2.03
> Fortstraße 7
> 76829 Landau
>
> Tel.: +49-(0)6341/280-34224
> Mobil:0152/03285324
>
> mail: graf at uni-landau.de
>
>
> web http://www.paeps.uni-landau.de
> web http://www.paeps.technik.uni-landau.de/
>
>
>
>
>