| プロパティ | 値 | 備考 |
|---|---|---|
| text-shadow: | none【影なし】 | [ 《length【長さ】》{2,3} && 《color【色】》? ]# | 手前から奥に記述 |
| １つ目の<length【長さ】> | 水平方向の影のオフセット | |
| ２つ目の<length【長さ】> | 垂直方向の影のオフセット | |
| ３つ目の<length【長さ】> | 影をぼかす範囲 |
<style>
.ex { font-size: 20px; height: 1.5em; }
.ex3 { font-size: 20px; height: 3.5em; }
.firstLetter::first-letter { text-shadow: 2px 2px 4px red; }
.firstLine::first-line { text-shadow: 2px 2px 4px red; }
</style>
<div class="ex" style="text-shadow:1px 1px;">
The quick brown fox jumps over the lazy dog.</div>
<div class="ex" style="text-shadow:2px 2px 4px blue;">
The quick brown fox jumps over the lazy dog.</div>
<div class="ex" style="text-shadow:6px 6px 2px blue, 4px 4px 2px cyan, 2px 2px 2px red;">
The quick brown fox jumps over the lazy dog.</div>
<div class="ex" style="color: white; text-shadow: 1px 1px 2px black;">
The quick brown fox jumps over the lazy dog.</div>
<div class="ex firstLetter">
The quick brown fox jumps over the lazy dog.</div>
<div class="ex3 firstLine">
The quick brown fox<br> jumps over<br> the lazy dog.</div>