Como adicionar sombras de texto e gota no Dreamweaver - manequins

Você pode aprimorar seus projetos no Dreamweaver e dar suas páginas de maior profundidade, adicionando sombras para imagens, tags e outros elementos. Adicionar sombras de texto torna suas palavras mais fáceis de ler, especialmente se seu design tiver um fundo complexo ou as cores de primeiro plano e de fundo não possuem contraste.

Crédito: Foto de iStockphoto. com

O Dreamweaver CC oferece melhor suporte e integração de sombras de texto CSS3 e sombras de texto a partir do novo painel CSS Designer.

Você pode criar estilos de classe ou ID com sombras de texto e você pode adicionar sombras de texto a elementos HTML existentes, definindo um estilo de tag, como o estilo do título 1 visto aqui. O código CSS3 que cria essa sombra de texto é

h1 {text-shadow: 2px 2px 2px # 000;}

Os números no código especificam que a sombra do texto deve estender 2 pixels para a direita e 2 pixels abaixo do texto com um borrão de 2 pixels. Além disso, a sombra é criada com a cor preta, especificada pelo código de cores hexadecimal abreviado n. 000.

Ao criar regras para sombras de texto, você pode especificar até quatro valores:

• horizontal e vertical : os dois primeiros valores de número são necessários e especifique a horizontal e deslocamentos verticais - a distância que a sombra se espalha por baixo do texto (vertical ) e à direita do texto (horizontal).

• raio de borrão : o terceiro valor especifica a quantidade de desfocagem na sombra. Se você não incluir o raio de desfocagem, o padrão é 0, o que faz com que a sombra apareça como uma cor sólida.

• cor : O quarto valor especifica a cor da sombra e pode ser definido usando um código de cor hexadecimal ou um código de cor RGBa.

Escolher uma cor RGBa para a opção Cor dá-lhe um maior controlo sobre a aparência da sombra porque pode adicionar transparências.

Você pode adicionar uma sombra de texto usando o painel Propriedades na parte inferior do painel CSS Designer. Para fazer isso, siga estas etapas:

1. Desça até a seção Sombra de texto do painel Propriedades do Designer CSS.

2. Digite o tamanho da sombra que deseja exibir usando os campos H-shadow (horizontal) e V-shadow (vertical).

3. Adicione a quantidade de desfocagem que deseja para a sombra do texto digitando um tamanho no campo de borrão.

4. Clique na cor bem e selecione a cor que deseja usar na sombra do texto.