Свойство text-shadow
CSS свойство text-shadow добавляет тень к тексту различных цветов, так же эффект размытия.
В простом случае вы указываете только горизонтальную тень (2 пикселя) и вертикальную тень (2 пикселя):
Эффект тени текста!
h1
{
text-shadow: 2px 2px;
}
Попробуйте сами »
Далее, добавьте цвет (красный) к тени:
Эффект тени текста!
h1
{
text-shadow: 2px 2px red;
}
Попробуйте сами »
Затем добавьте эффект размытия (5 пикселей) к тени:
Эффект тени текста!
h1
{
text-shadow: 2px 2px 5px red;
}
Попробуйте сами »
Еще примеры text-shadow:
Пример 1
Текстовая тень на белом:
h1 {
color: white;
text-shadow: 2px 2px 4px #000000;
}
Попробуйте сами »
Пример 2
Текстовая тень с красным неоновым свечением:
h1 {
text-shadow: 0 0 3px #ff0000;
}
Попробуйте сами »
Пример 3
Текстовая тень с красным и синим неоновым свечением:
h1 {
text-shadow: 0 0 3px #ff0000, 0 0 5px #0000ff;
}
Попробуйте сами »
Пример 4
h1 {
color: white;
text-shadow: 1px 1px 2px black, 0 0 25px blue, 0
0 5px darkblue;
}
Попробуйте сами »
Совет: Перейдите к главе CSS Шрифтам, в которой рассказывается о том, как изменять шрифты, размер текста и стиль текста.
Совет: Перейдите к главе CSS Текстовым эффектам, посвященная различным текстовым эффектам.
Все CSS свойства text-shadow
| Свойство | Описание |
|---|---|
| text-shadow | Задает эффект тени, добавляемый к тексту |