Modificación de diseño css en dreamweaver cs5 adobe

Video: Dreamweaver CS5 - CSS Tutorial: Layout

Morada Creative Suite 5 (CS5 de Adobe) Dreamweaver ofrece varias maneras de cambiar un diseño de página Cascading Style Sheets. Un diseño CSS es controlado por completo por las reglas de hojas de estilo, para que pueda modificar la apariencia de la página directamente desde el panel Estilos CSS y el inspector de propiedades.

Video: CSS Tutorial with Dreamweaver CS5

Cada columna, caja, y el espacio en su nueva página está posicionada y dimensionada utilizando reglas y propiedades CSS, todos los cuales se pueden ajustar, ya sea del inspector de propiedades (en el panel Estilos CSS) o el panel de definición de reglas CSS.

  1. Si el panel Estilos CSS no está abierto, seleccione Ventana → Estilos CSS para abrirlo.

  2. Seleccione la pestaña Todas para mostrar la hoja de estilo y sus reglas.

    La hoja de estilo interna se muestra como en la cima. Haga clic en la flecha a la izquierda para expandirlo y mostrar todas las reglas que contiene. Diseños utilizando una hoja de estilo adjunto (externo) mostrar el nombre de hoja de estilo (como styles.css) en lugar de la etiqueta.

  3. Selecciona el cuerpo regla.

    Este estilo basado en etiquetas que controla el formato general de toda la página (todo dentro de la etiqueta).

  4. Haga clic en el campo junto a la regla de fondo para editar las audiencias no fueron mantener la # 4E5869 (Gris medio) establecer, escriba un color hexadecimal (tal como # CC0000 para el rojo) para cambiar el color de fondo de la página.

  5. Clic en la muestra junto a la regla de color para abrir el panel sensible Muestras elegir un nuevo tipo de color predeterminado para el texto en su página.

  6. En la parte superior del panel Estilos CSS, seleccione otro estilo (por ejemplo, el .estilo #container twoColElstHdr) Para ver sus propiedades.

    los .twoColHybLtHdr #estilo de ID de contenedor controla el tamaño y la apariencia del envase principal de diseño de la página.

  7. En el inspector de propiedades, edite las propiedades para cambiar la apariencia del estilo.

    Por ejemplo, se puede cambiar el ancho de la regla mediante la introducción de un nuevo número en el cuadro de texto Ancho Regla. Si introduce 95%, por ejemplo, se hace todo el diseño en general.

Video: Curso de Dreamweaver cs5 - estilos css - P4

Cada columna y sección que comprende el diseño es controlado por uno de los estilos de identificación que figuran en el panel Estilos CSS. La mayoría de cada estilo ID cuenta con una propiedad de ancho se puede usar para cambiar el tamaño de las diferentes áreas de la página.

Seguir modificando diferentes estilos que figuran en el panel Estilos CSS y ver cómo afectan a diferentes elementos en su página. Intente cambiar el tipo de color, familia de fuentes, y otras propiedades, tales como relleno y color de fondo.

Video: Learn Dreamweaver CS5 - New CSS features in Dreamweaver CS5 Adobe TV.flv

Para averiguar exactamente qué controles de identificación que la columna o de la sección, haga clic dentro del área de la página y mirar el selector de etiquetas en la parte inferior de la ventana de documento. La última etiqueta en el extremo de la cadena que muestra qué recipiente en que está y su correspondiente ID en el panel Estilos CSS (por ejemplo,).

Artículos Relacionados