Página inicial

El Panel CSS (I)


Veamos cómo funciona el panel CSS .

El Panel CSS

 

Hemos visto como Dreamweaver nos permite crear estilos de una forma muy rápida y sencilla, los estilos creados de esta manera se agrupan en una hoja de estilos que se encuentra incrustada en nuestro documento, pero también podemos utilizar estilos que se encuentren en hojas externas al documento. Este particularidad es muy útil cuando diseñamos un sitio web con varias páginas ya que permite definir una sóla hoja de estilos que utilizarán todas las páginas del sitio y así facilitar el diseño.

Vamos a ver cómo funcionan las hojas de estilo a través del panel CSS pestaña Estilos CSS, que puede abrirse a través del menú Ventana, opción Estilos CSS. Existen otras alternativas para abrir este panel, una es pulsando Mayús+F11, o puedes hacer clic en el botón CSS que aparece en el Inspector de Propiedades.

Para simplificar las explicaciones llamaremos panel Estilos CSS a la pestaña Estilos CSS del panel CSS.

En este panel aparecen las hojas de estilos asociadas al documento, los estilos contenidos en cada hoja de estilos y unos botones en la parte inferior que nos permiten realizar cambios en los estilos.

 

Como puedes ver en la imagen, en la parte inferior del panel puedes ver una lista de las propiedades que forman parte del estilo, podrás editarlas con un sólo clic y actualizarlas o añadir nuevas haciendo clic en el vínculo Añadir propiedad.

Desde los botones Botones propiedades de estilo podrás ordenar las propiedades de diferentes maneras. Con el primer botón mostrarás todas las propiedades ordenadas por categorías (Fuente, Fondo, Bloque, Borde, etc..); también puedes mostrarlas ordendas de la A a la Z con el segundo botón.

Como predeterminado se muestran únicamente las propiedades utilizadas (las cuales podrás mostrar haciendo clic en el tercer botón).

Si la parte del pie del panel no fuese visible prueba a modificar su tamaño colocando el cursor en el borde inferior y haciendo clic arrástralo hasta que sus dimensiones te dejen verlo.

 




      Índice del curso  Ir a la siguiente página

Seguir con el avanzado...

 
© aulaClic. Todos los derechos reservados. Free Computer tutorials. Prohibida la reproducción por cualquier medio.
Agosto - 2006.