このサイトのエントリーヘッダーを少し変えてみたので左にスクリーンショットを置いてみたのですが、分かるでしょうか？微妙に影がついているですよ。本当に微妙ですけどね（＾＾；
これは「text-shadow」というプロパティを使ったテクニックで文字通り影をつけることが出来ます。しかし、残念ながらこの効果はSafari1.1以上ではないと見る事の出来ない今はまだ超レアなプロパティなのですが、W3Cが勧告しているCSS2のスペックをチェックしみるとちゃんとtext-shadowがあるので、Safariが独自に搭載しているプロパティではなく標準CSSなんですよね。ということはInternet Explorerをはじめとした他のブラウザも次期バージョンではサポートされる！？なんてあるかもしれません。
このサイトで使っているtext-shadowは以下のとおり
text-shadow: 2px 2px 2px #999999;
応用するといろいろおもしろそうな効果が出せそうなtext-shadowですが、Safari1.1以上という非常に少ないユーザーしか見ることの出来ない寂しいプロパティですね。しかし、text-shadowをCSSファイルに加えておいても他のブラウザでエラーが発生することもないですし、正規のCSS2スペックなので近い将来使えるプロパティになると思いますので、とりあえず入れておいても良いかも。
こんにちは。初めまして。text-shadow 便利ですよね。僕も使いたいと思うのですが、おっしゃる通り Safari でしか実装されてないのが残念です。
で、このプロパティ、CSS2 で正規に規定されているのはその通りなのですが、その後に現実のブラウザの実装状況を鑑みて策定された CSS2.1 では、なかったことにされています。
http://www.w3.org/TR/2003/WD-CSS21-20030915/text.html
http://www.w3.org/TR/2003/WD-CSS21-20030915/changes.html#q24
まあ、まだ WD ですし、そもそも拘束力はないので、流行れば実装するブラウザも増えるかもしれませんが。
とまあ、以上のような話もあるので、「近い将来使えるプロパティになる」というのは楽観視出来ないかもしれません。
ちなみに CSS3 では復活してますので、「遠い将来」には希望が持てます:-)
http://www.w3.org/TR/2003/CR-css3-text-20030514/#text-shadows
こんにちは、kotaroさん。
補足情報ありがとうございます。CSS2.1なんてあるとは知りませんでした。相変わらずですが、実装状況ってよく変わりますよねぇ。XHTMLの次期バージョンもなんかよくわからない事になっているみたいだし。
僕も便利な機能だと思うのでいち早く多くのブラウザで（とくにIE）実装してもらいたいものです。
IEでのレンダリングならば、独自拡張のfilterプロパティを使えば実現できます。
未知のプロパティは無視されるのがCSSの仕様ですから、他のブラウザ(filterプロパティに対応していないブラウザ)には影響ありませんし。
<div style="width:100%; color:maroon; font-weight:bold; filter:
DropShadow(color=#999999,offx=1,offy=1,positive=1);">マスターするぞCSS</div>
実は Gecko 系だと以下のような方法でドロップシャドウっぽいことが出来たりします。
http://web-graphics.com/mtarchive/001144.php
これで Safari、WinIE、Mozilla 系でドロップシャドウがつけられるので実は使い物になるのかも。
Good Point. Anyways, this was where i met her. You can join for free as well www.redtricircle.com
