Modificación de diseño CSS en Adobe CS5 Dreamweaver

Morada Creative Suite 5 (CS5 de Adobe) Dreamweaver ofrece múltiples formas de cambiar una página Hojas de diseño de estilo en cascada. Un diseño CSS es controlado completamente por las reglas de hojas de estilo, así que usted puede modificar la apariencia de la página directamente desde el panel Estilos CSS y el inspector de propiedades.

Cada columna, caja, y el espacio en su nueva página está posicionado y dimensionado 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, elija 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 Encima. Haga clic en la flecha a la izquierda para expandirla y mostrar todas las reglas que contiene. Presentaciones utilizando una hoja de estilos adjunta (externo) mostrará el nombre de la hoja de estilo (como styles.css) en lugar de la etiqueta.


  3. Selecciona el cuerpo gobernar.

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

  4. Haga clic en el campo al lado de la regla de fondo para editar IT- en lugar de mantener el # 4E5869 (gris medio) establecer, escriba un color hexadecimal (por ejemplo, # CC0000 para el rojo) para cambiar el color de fondo de la página.

  5. Haga clic en la muestra junto a la regla de color para abrir las Muestras panel- elegir un color nuevo tipo 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 Identificación contenedor controla el tamaño y la apariencia del envase principal disposición en la página.


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

    Por ejemplo, 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, a hacer todo el diseño en general.

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 que puede utilizar para cambiar el tamaño de las diferentes áreas de la página.

Continuar modificar diferentes estilos enumerados en el panel Estilos CSS y ver cómo afectan los diferentes elementos en su página. Intente cambiar el color de tipo, la familia de la fuente, y otras propiedades, tales como el relleno y color de fondo.

Para averiguar exactamente qué controles que la columna o de la sección de identificación, haga clic en el área de la página y mirar el selector de etiquetas en la parte inferior de la ventana de documento. El último

etiqueta al final de la cadena que qué contenedor que está y su correspondiente identificación en el panel Estilos CSS (por ejemplo, muestra, ).




» » » » Modificación de diseño CSS en Adobe CS5 Dreamweaver