Dreamweaver cs6: adicionar sombras de texto com css3

No Dreamweaver CS6, você pode melhorar seus projetos e dar suas páginas uma maior profundidade, adicionando sombras de texto com regras CSS3, o mais recente em tecnologia web. Adicionar sombras de texto faz com que suas palavras mais fáceis de ler, especialmente se o seu projeto tem um fundo complexo ou se seus fundo e texto cores falta de contraste.

Dreamweaver CS6 inclui suporte para CSS3 sombras de texto quando você usa o painel Propriedades no painel Estilos CSS. Você pode criar estilos de classe ou ID com sombras de texto, e você pode adicionar sombras de texto para elementos HTML existentes, definindo um estilo de tag, como o estilo de título 1 usada na imagem.

O código CSS3 que cria essa sombra de texto é

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

Os números no código de especificar que a sombra de texto deve estender 2 pixels para a direita e 2 pixels abaixo o texto com um borrão 3-pixel. Além disso, a sombra é criado com a cor preta, especificado pelo código abreviado cor hexadecimal # 000.

Video: CSS3 Full Screen Background Image - Dreamweaver CS6 Tutorial

Ao criar regras para as sombras do texto você pode especificar até quatro valores:

• Horizontal e vertical: Os dois primeiros valores numéricos são necessários e especificar os deslocamentos horizontais e verticais - a distância a sombra se estende abaixo do texto (horizontal) e à direita do texto (vertical).

• raio de desfoque: O terceiro valor especifica a quantidade de desfocagem na sombra. Se você não incluir raio de desfoque, o padrão é 0, o que torna a sombra aparece como uma cor sólida.

• 
  
  
  

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

Você pode adicionar uma sombra de texto usando o painel de propriedade no fundo do painel Estilos CSS, como mostrado na imagem. Para fazer isso, siga estes passos:

1. Clique no link Adicionar propriedade no lado esquerdo do painel Propriedade Estilos CSS.

2. Digite o estilo CSS3 nome da regra, text-shadow, ou selecione a regra de estilo a partir da lista drop-down.

   Depois que o nome aparece no lado esquerdo, uma pequena seta aparece à direita.

3. Clique para selecionar a seta à direita do text-shadow.

   Video: Dreamweaver CS6 Training - Part 34 - HTML CSS Basics - Create a Website Course

   Aparece uma caixa.

4. Digite o X e Y deslocamentos, raio de desfoque, e cor.

   Video: Creating CSS Transitions in Dreamweaver CS6