Dreamweaver cs6: añadir sombras de texto con css3

En Dreamweaver CS6, puede mejorar sus diseños y dar a sus páginas de mayor profundidad mediante la adición de sombras de texto con las normas CSS3, lo último en tecnología web. La adición de las sombras del texto hace que sus palabras más fáciles de leer, especialmente si su diseño tiene un fondo complejo o si sus antecedentes y los colores de texto carecen de contraste.

Video: Curso de HTML5 esencial - Atributos CSS3 (Sombras en texto, imágenes )

Dreamweaver CS6 incluye soporte para CSS3 sombras de texto cuando se utiliza el panel de propiedades en el panel Estilos CSS. Puede crear estilos de clase o de identificación con las sombras de texto, y se puede añadir sombras de texto a los elementos HTML existentes mediante la definición de un estilo de etiqueta, tales como el estilo de título 1 utilizado en la imagen.

El código CSS 3 que crea que es sombra de texto

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

Los números en el código especifican que la sombra del texto debe extenderse 2 píxeles a la derecha y 2 píxeles por debajo del texto con un desenfoque de 3 píxeles. Además, la sombra se crea con el color negro, especificada por el código de color hexadecimal abreviada # 000.

Video: CSS3: Cómo poner sombras a textos de una página web

Al crear reglas para las sombras del texto puede especificar hasta cuatro valores:

• Horizontal y vertical: Los dos primeros valores de números se requieren y especifican los desplazamientos horizontal y vertical - la distancia que la sombra se extiende por debajo del texto (horizontal) y a la derecha del texto (vertical).

• radio de desenfoque: El tercer valor especifica la cantidad de desenfoque a la sombra. Si no se incluye radio de desenfoque, el valor predeterminado es 0, lo que hace que la sombra aparece como un color sólido.

• Color: El cuarto valor especifica el color de la sombra y se puede definir mediante un código de color hexadecimal o un código de color RGBA.

Video: Crear pagina web con Dreamweaver, Estilos css para texto, video 24

Puede añadir una sombra de texto utilizando el panel de propiedades en la parte inferior del panel Estilos CSS, como se muestra en la imagen. Para ello, siga estos pasos:

1. Haga clic en el vínculo Agregar la propiedad en el lado izquierdo del panel de propiedades Estilos CSS.

2. Introduzca el estilo CSS3 nombre de la regla, sombra de texto, o seleccione la regla de estilo de la lista desplegable.

   Después de que el nombre aparece en el lado izquierdo, una pequeña flecha aparece a la derecha.

3. Haga clic para seleccionar la flecha a la derecha del texto-sombra.

   Aparece un cuadro.

4. Introduzca la desplazamientos x e y, radio de desenfoque, y color.

   Video: CSS3: Cómo poner sombras a elementos en una página web