簡単なテキストの装飾効果は text-decoration プロパティで指定する。与え方は次のいずれかである。

text-decoration: キーワード;
text-decoration: none;

このプロパティは，

• すべての要素に適用される。ただし，その要素がテキストでない場合（画像など）は，意味を持たない。
• 初期値は，キーワード none である。
• その要素で text-decoration プロパティを指定しなかった場合，プロパティの値は初期値に戻される。ただし，それまで（親要素）で装飾が指定されていた場合には，その装飾は引き続いて行われる。

　キーワード none を与えた場合には，テキストの装飾は行われない。それ以外のキーワードは，次にあげるものから順序に関係なく，複数選んでよい。

underline

テキストに下線を引く。

overline

テキストにオーバーラインを引く。

line-through

テキストに打ち消し線を引く。

blink

テキストを点滅させる。これをサポートしないブラウザもある。

　まずは，簡単な例をご覧いただこう。

H1 { text-decoration: underline overline; }
A { text-decoration: none; }

<H1>ed ドメイン</H1>
<P>　“すべての学校にインターネットを”を受けて，小中高校をはじめとした教育機関に ed.jp のドメインが割り当てられる。この作業は，<A HREF="http://www.nic.ad.jp/">JPNIC</A> で 1998年から進められている。</P>

　ところで，text-decoration プロパティで指定される装飾は，その要素の color プロパティで与えられる色になる。このとき注意しなくてはいけないのは，下線などが引かれている状態で，text-decoration プロパティを再指定せずにテキストの色を変えても，その色はそこで指定したテキストの色にはならないことである。たとえば，

P { text-decoration: underline; color: black; }
EM { color: red; }

において，

<P>　プログラマは，プログラミング言語に関して保守的だという。しかし，その中で C++ で受け入れられたのは，多くのプログラマの支持を得ていた <EM>C からの移行が簡単だった</EM>からと言える。その反面，C++ は<EM>不完全なオブジェクト指向</EM>という短所を背負い込んだ。</P>

の EM 要素の下線は，文字色が赤に指定されているにも関わらず，黒となる。

　text-shadow プロパティは，テキストへの影の効果を指定するものである。

text-shadow: 影の性質, 影の性質, ...;
text-shadow: none;

このプロパティは，

• すべての要素に適用される。ただし，その要素がテキストでない場合（画像など）は，意味を持たない。
• 初期値は，キーワード none である。
• その要素で text-shadow プロパティを指定しなかった場合，プロパティの値は初期値に戻される。ただし，それまで（親要素）で影が指定されていた場合には，その影は引き続いて付加される。

　キーワード none は，影を付加させない。影を付加するには，“影の性質”を記述したカンマ区切りリストを与える。影は，このカンマ区切りリストの順で重ねられていく。この書式は，

横位置 縦位置 ぼかし半径 色
色 横位置 縦位置 ぼかし半径

のいずれかである。ただし，“ぼかし半径”，“色”はいずれかまたは両方を省略してもよい。

• “横位置”，“縦位置”では，影の位置を長さで与える（負の値も許される）。通常のテキストの位置を基準にして，横は右方向を，縦は下方向を正にとる。たとえば，3px 2px であれば，影はテキストの 3 ピクセル右，2 ピクセル下にできる。-3px -2px ならば，3 ピクセル左，2 ピクセル上になる。
• “ぼかし半径”は影をぼかすとき，その半径を長さで与える（負の値は許されない）。省略すると 0，すなわち影はぼかされない。
• “色”は影の色である。省略された場合は，color プロパティの値と同じになる。ぼかし半径が 0 の場合は，影は指定された色そのものになる。ぼかし半径が 0 でなければ，影の色は指定された色を基調とする。

　簡単な例をご覧いただこう。

H1 { color: black; text-shadow: 3px 3px silver; }

<H1>ガウス分布</H1>

この場合，テキストから右に 3ピクセル，下に 3ピクセルの位置に銀色の影が落とされる。

　複数の影を落としてみよう。

H1 { color: black; text-shadow: silver -5px 5px 4px, #CCF 0 0 2px; }

　最初は，テキストから左に 5ピクセル，下に 5ピクセルの位置に，ぼかし半径 4 ピクセルの銀色の影である。2 番めの影はそれに重ねて描かれる。テキストと同じ位置に，ぼかし半径 2 ピクセルの，淡い青色の影ができる。これを先の例と同じ HTML に適用させると，

となる。