CURSO COMPLETO DE DREAMWEAVER 8

--MEDIOS--



09 - HOJAS DE ESTILO CSS - PARA UN SOLO DOCUMENTO

Las hojas de estilo te permiten cambiar la apariencia de cientos de páginas Web modificando solo un archivo. La denominación "en cascada" se utiliza para indicar que los estilos dinámicos aplicados a un elemento, serán heredados por los elementos hijo de este.

Un estilo local, siempre prevalece sobre un estilo global.

Las hojas de estilos, se puede realizar de dos formas, para que afecten a un solo documento. que es lo que vamos a ver en este tutorial.  o bien guardar como arhivo .css, para poder emplearlo en varias páginas del site, que es el tutorial siguiente.

Vamos a crear una hoja de estilos sencilla.

Abrimos un nuevo documento y abrimos la paleta de estilos:

Ventana > Estilos CSS

Nueva regla css:




Clase: Afecta solo a una parte del documento

Etiqueta: Permite modificar las propiedades de las etiquetas de html

Avanzadas: Permite modificar un estado concreto, por ej. un enlace.

Definir en: Permite elegir el estilo de los cuatro estados que tiene un vinculo.

En este caso vamos a modificar la etiqueta body, y vamos a crearlo solo en el documento actual:



Se nos abrirá una nueva ventana "Definición de la regla body" con todas las opciones modificables a la etiqueta body:



Como son muchas, tan solo voy a explicar las más usadas, el mejor consejo que os puedo dar es que trasteeis todo lo que podais, y así vereis las distintas opciones, tanto de esta etiqueta, como de las demás.


En la pestaña tipo:

Fuente, tamaño, grosor y estilo: De sobra sabemos que és :p

Alto de linea: Especifica el alto de linea del texto.

Decoración: Nos ofrece distintos efectos con el texto.


En la pestaña fondo:

Color de fondo, imagen de fondo y repetir: Ya sabemos lo que és.

Anexo: Te ofrece la posibilidad de que el fondo esté fijo o por el contrario se desplace con el contenido

Posición: Se suele emplear para alinear una imagen de fondo, en el centro de la pantalla.


La pestaña bloque: Se utiliza para definir el párrafo o bloque de texto de una página.


La pestaña cuadro: Se utiliza para definir, los elementos de la página, como por ej. tablas y capas.


La pestaña borde: Define el borde la caja del elemento sobre el que se aplica.


La pestaña lista: Se pueden establecer las carácteristicas de las listas contenidas en nuestras páginas.


La pestaña posición: Permite controlar la posición del elemento en el documento.


La pestaña extensiones: Nos permite dar una serie de efectos a nuestra página, pero estos son solo soportados por internet explorer

Para modificar los estilos, lo vamos ha hacer desde la paleta de capas, podemos observar ahora, que todos los estilos que hemos selecciodo anteriormente, se encuentran ahora reflejados en el inspector de estilos:



Para modificar cualquier de ellos, tan solo hay que hacer doble click en los valores que queramos modificar y se nos abrirá un desplegable con las posibles opciones.



Para abrir nuevamente la ventana de definición de regla para body, tan solo debes hacer doble click en cualquier lugar del "Resumen de la selección"



2007©By Almaweb.es

subir

Ir al menú de tutoriales de DREAMWEAVER

Todos los tutoriales son de mi completa autoría,

cualquier parecido con otros, es pura coincidencia.

Queda totalmente prohibida su reproduccion, total o parcial.

Si quieres enlazar mis tutoriales, no hay problema,

solo mandame un e-mail, para comunicarmelo.

Cualquier duda o sugerencia:

Tutoriales registrados

 

Alma Web

Design Sensation by almaweb.es

Foro Design Sensation