Cómo añadir sombras y de texto en dreamweaver

Puede mejorar sus diseños en Dreamweaver y dar a sus páginas de mayor profundidad mediante la adición de sombras a las imágenes, etiquetas y otros elementos. 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 los colores de primer plano y de fondo carecen de contraste.

[Foto por iStockphoto.com]

Dreamweaver CC ofrece un mejor soporte e integración de sombras CSS3 y las sombras del texto del nuevo panel Diseñador de 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 se ve aquí. El código CSS 3 que crea que es sombra de texto

h1 {text-shadow: 2px 2px 2px # 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 2 píxeles. Además, la sombra se crea con el color negro, especificado por el código de color hexadecimal abreviado # 000.

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 (vertical) Ya la derecha del texto (horizontal).

  • 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.

La elección de un color RGBA para la opción del color le da un mayor control sobre la apariencia de la sombra porque se puede añadir transparencia.

Puede añadir una sombra de texto utilizando el panel Propiedades en la parte inferior del panel Diseñador de CSS. Para ello, siga estos pasos:

  1. Desplazarse hacia abajo a la sección de sombra de texto del panel Propiedades diseñador CSS.

    Video: Cómo poner Texto con Sombra en DreamWeaver TUTORIAL Diseño web - html, css

  2. Introduzca el tamaño de la sombra que desea visualizar utilizando la H-sombra (horizontal) y campos V-sombra (verticales).

  3. Añadir la cantidad de desenfoque que desea para su sombra texto mediante la introducción de un tamaño en el campo de la falta de definición.

  4. Haga clic en el cuadro de color y seleccione el color de su desea utilizar en la sombra del texto.

    Video: CÓMO CREAR EFECTO SOMBRA EN TEXTO | PHOTOSHOP CC TUTORIAL

Artículos Relacionados