text-shadowプロパティについて、正しい指定方法はどれか。(全て選択)
正解！おめでとう！
解説
text-shadowプロパティは、テキストに影を付けることができる。
text-shadowプロパティに指定できる値を下の表にまとめたよ。
| 値 | 詳細 |
|---|---|
| 数値 | 1番目の数値は、影をテキストからどれだけ右にずらすかを指定する。負の値を指定すると、影は左にずれるよ。 2番目の数値は、影をテキストからどれだけ下にずらすかを指定する。負の値を指定すると、影は上にずれるよ。 3番目の数値は、影をぼかす範囲を指定する。大きな数値ほどぼかす範囲が大きくなるよ。 |
| 色 | 影の色を指定する。 |
| none | 影を表示しない。 |
数値は必ず2～3個指定する。数値を1つしか指定しなかった場合、エラーになるよ。
数値は単位付きで指定する。
3番目の数値に負の値を指定することはできない。3番目の数値に0を指定すると、ぼかしはなくなる。
text-shadowプロパティの使い方をまとめたよ。
See the Pen Untitled by ねこたろう (@neko03) on CodePen.
1つ目のテキストは、右下に3pxずらして影を表示。
2つ目のテキストは、右下に3pxずらして、ぼかしを3px入れて影を表示。
3つ目と4つ目のテキストは、右下に3pxずらして、ぼかしを3px入れて、青い影を表示。色の指定は、数値の前でも後ろでも同じ意味になるよ。
5つ目のテキストは、右下に3pxずらして、ぼかしを3px入れて、薄い青い影を表示。加えて、左上に3pxずらして、ぼかしを3px入れて、濃い青い影を表示。
選択肢にある「text-shadow : 3px ;」は数値を1つしか指定していないからエラーになる。それ以外は要件を満たしているので正解。
おしい…もう一度…！
Comment