CSSのテキスト刻まれたまたは押し込まれたエフェクト

Question

ここに来たら - http://djangocon.us/。一番上にdjangoconのロゴがあります。このロゴはすべてテキストです&本文は内側に押し込まれているようです。

私はCSS &を見て、この効果を引き起こす可能性のあるものが得られなかったと考えています。誰も知っている？

UPDATE：私はそれが間違ってましたように見えます。上部のロゴはイメージです。しかし、その下の文章はそうではありません。同じ押されたテキストを与えます。暗い緑の長方形のボックス（ナビゲーションバーの下）。

Answer 1

text-shadowプロパティが必要です。 http://www.quirksmode.org/css/textshadow.html

編集：リンクしたページは、実際には画像を使用して実際にそれを達成しています。 http://djangocon.us/site_media/static/img/header.png

Answer 2

text-shadow: 0 1px 0 color;を使用すると、同じ効果が得られます。

あなたはより多くの情報が必要な場合は、放火犯で簡単に見て見にhttp://www.css3.info/preview/text-shadow/

Answer 3

を持っている、そしてそれは、テキストshadowプロパティです。私はそれを自分で使ったことはありません。

Answer 4

テキストシャドウは正しいです。私は定期的にそれを使用し、いくつかの興味深い効果を生むことができます（ただし、ブラウザのサポートはまだ完了していないので、何か重要なことに頼るべきではありません）。

しかし、他のポスターも述べているように、リンク先の画像はうまいです...画像。レイヤーのブレンドオプションを使用して、ぼかしのないドロップシャドウやベベル/エンボスの設定を使用して、このエフェクトをPhotoshopで簡単に実行できます。これは、ブラウザでのイメージサポートが明らかにCSS 3のサポートよりも広いので、タスクを達成するためのより信頼性の高い方法です。

私は通常、ロゴや重要なお知らせのような重要なものについては画像の側でエラーが発生します。また、イメージを使ってアンチエイリアスを制御することもできますが、CSS 3を使用して完全に制御することはできません（ほとんどのブラウザベースのアンチエイリアスはかなりうまくいきます）。

テキストシャドウを使用するページのより良い例は、フッターにあります。ここではChromeから計算されたスタイルがある：

Answer 5

http://css3please.comは、これらを覚えておくための最も簡単な方法ですが、私は見つけます。

Answer 6

text-shadowプロパティを使用すると、テキストを押して効果を達成できます。このサンプルを参照してくださいhttp://line25.com/wp-content/uploads/2009/letterpress/demo/demo.html