Estilo de texto é um fator importante utilizado para aprimorar os elementos do site. Inclui vários elementos HTML, como links, imagens e botões que devem ser sincronizados e consistentes. Também, CSS pode garantir que o texto adicionado em uma página da web seja bem sincronizado. Para esse fim, vários recursos de texto podem ser usados, incluindo tamanho de texto, cor da fonte, orientação para o texto e cor da fonte. ““Shadow de texto”Também está incluído na lista dessas propriedades fantásticas.

Este artigo discutirá o Propriedade da sombra de texto e suas opções relacionadas com a ajuda de exemplos adequados.

Propriedade-sombra de texto em CSS

No CSS, você pode utilizar o “Shadow de texto”Propriedade para Adicionando sombras para o Html texto elementos. Compreende diferentes tipos de sombras que podem ser aplicadas usando CSS interno, externo ou embutido.

A sintaxe da propriedade-sombra de texto em CSS é dada abaixo.

Sintaxe

Shadow Text: H-Shadow V-Shadow Blur-Radius Cor | Nenhum | Inicial |
herdar;

Os atributos do valor da sombra de texto são descritos abaixo.

Valores necessários
H-Shadow: Este valor é usado para especificar a posição horizontal da sombra de texto. Valores negativos podem ser usados ​​para mover a sombra para o lado esquerdo.

V-Shadow: Este valor é necessário para definir a posição vertical de uma sombra. V-Shadow também aceita os valores negativos como deslocados-y.

Todos os valores mencionados acima serão utilizados no exemplo abaixo do rumo.

Exemplo
No exemplo abaixo, definimos “1px" como "H-Shadow" e "3px" como "y-shadow”Valores. Além disso, a “cor” da sombra de texto é especificada como “vermelho”:

Efeito da sombra de texto!

Saída

Valores opcionais

Blur-Radius: É utilizado para embaçar a sombra de texto e seu valor padrão é 0.

nenhum: Isso mostra que nenhum efeito de sombra é adicionado ao texto.

cor: Esta opção é utilizada para especificar a cor da sombra de texto.

inicial: Esta opção é utilizada para especificar o valor padrão da propriedade-sombra de texto.

herdar: Você pode herdar esta propriedade do seu elemento HTML dos pais.

Agora, vejamos alguns exemplos relacionados aos valores fornecidos por text-shadow.

Exemplo: Adicionando cor à sombra de texto

Efeito de cor-shadow de texto

A execução do código acima adicionado adicionará um efeito de cor "laranja" à sombra de texto adicionada:

A seguir, o exemplo mostra o efeito desfoque em uma propriedade de sombra de texto.

Exemplo: Adicionando efeito de desfoque à sombra de texto

Efeito do desfoque da sombra de texto!

Saída

A propriedade-sombra de texto também aceita a lista de sombras separadas pelas vírgulas. O exemplo a seguir demonstrará o procedimento para executar a operação especificada.

Exemplo

Shadow de texto com brilho de texto múltiplo.

Saída

Fornecemos as informações mais essenciais relacionadas ao uso de “Shadow de texto” Propriedade em CSS.

Conclusão

Em CSS, Propriedade da sombra de texto é utilizado para adicionar sombras aos elementos de texto HTML. É usado principalmente para adicionar cores ao texto, embaçar sua sombra e definir sua posição horizontal e vertical. Este artigo fornece um guia completo sobre o procedimento de uso de dimensões horizontais e verticais da sombra de texto, embaçar a sombra de texto e, finalmente, usando cores com a propriedade de shadow de texto do CSS.