A propriedade text-shadow do CSS
- Página anterior text-overflow
- Próxima página text-transform
Definição e uso
A propriedade text-shadow define a sombra para o texto.
Veja também:
Tutorial do CSS3:Efeitos de texto CSS3
Manual do HTML DOM:Propriedade textShadow
Exemplo
Efeito básico de sombra de texto:
h1
{
text-shadow: 5px 5px 5px #FF0000;
}
Mais exemplos na parte inferior da página.
Sintaxe do CSS
text-shadow: h-sombra v-sombra desfoque cor;
Notas:A propriedade text-shadow adiciona uma ou mais sombras ao texto. Esta propriedade é uma lista de sombras separadas por vírgula, onde cada sombra tem dois ou três valores de comprimento e uma cor opcional. O comprimento omitido é 0.
Valor do atributo
| Valor | Descrição | Teste |
|---|---|---|
| h-sombra | Obrigatório. Posição horizontal da sombra. Permite valores negativos. | Teste |
| v-sombra | Obrigatório. Posição vertical da sombra. Permite valores negativos. | Teste |
| desfoque | Opcional. Distância de desfoque. | Teste |
| cor | Opcional. Cor da sombra. Veja Valores de Cor CSS. | Teste |
Detalhes técnicos
| Valor padrão: | nada |
|---|---|
| Herança: | sim |
| Versão: | CSS3 |
| Sintaxe do JavaScript: | object.style.textShadow="2px 2px #ff0000" |
Mais exemplos
- Sombra de texto com efeito de borrão
- Este exemplo demonstra a sombra de texto com efeito de borrão.
- Sombra de texto sobre texto branco
- Este exemplo demonstra o efeito de sombra de texto sobre texto branco.
- Sombra de texto com efeitos neon
- Este exemplo demonstra o efeito de sombra de texto com efeitos neon.
Suporte do navegador
Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 4.0 | 10.0 | 3.5 | 4.0 | 9.6 |
- Página anterior text-overflow
- Próxima página text-transform
