Configurar las propiedades de una Página
Los títulos
de página, las imágenes, los colores de fondo, los colores del texto y de los
vínculos son propiedades básicas de todos los documentos HTML. El título de
página identifica y da nombre al documento. Una imagen o un color de fondo definen
la apariencia global del documento. Los colores del texto y los vínculos ayudan
a los usuarios a distinguir entre el texto normal y el hipertexto, así como a
reconocer qué vínculos han visitado y cuáles no.
Es conveniente definir
sitios homogéneos, que todas las páginas de un sitio sigan un mismo formato, es
decir, que tengan el mismo color de fondo, de fuente, etc.
Puede definirse el
formato de cada una de las páginas a través del cuadro de diálogo Propiedades
de la página.
Este cuadro se puede
abrir de tres modos diferentes:
- Pulsar la combinación de teclas Ctrl + J.
- Hacer clic sobre el menú Modificar y elegir la opción Propiedades de la página.
- Hacer clic con el botón derecho del ratón sobre el fondo de la página. Aparecerá al final del menú contextual la opción Propiedades de la página.
Se abrirá el cuadro de
diálogo siguiente:
![]() |
http://bit.ly/1erwGue |
En la categoría Apariencia
(CSS), como ves en la imagen anterior, encontramos las propiedades:
- Fuente de página: es el tipo de letra que le aplicaremos al texto.
- Tamaño: es el tamaño de la fuente que aplicaremos al texto.
- Color del texto: es el color de la fuente.
- Color del fondo: permite especificar un color de fondo para el documento, pero dicho color solo se mostrará en el caso de no haber establecido ninguna imagen de fondo.
- Imagen de fondo: permite especificar una imagen de fondo para el documento. Dicha imagen se muestra en mosaico. Es importante al elegir una imagen de fondo tener en cuenta que según los colores de la imagen será necesario establecer unos u otros colores para el texto, así como que no es conveniente tener un gif animado como fondo.
- Repetir: permite especificar si queremos que la imagen de fondo se repita o no. Si no queremos que se repita, seleccionamos la opción no-repeat. Si queremos que se repita o dejamos la opción en blanco o seleccionamos la opción repeat. Si queremos que se repita solo en horizontal seleccionamos la opción repeat-x y si queremos que se repita en vertical, entonces seleccionamos repeat-y.
- Márgenes: permiten establecer márgenes en el documento, es decir, la distancia entre donde empieza el contenido de la página y la ventana del navegador.
En la categoría Apariencia
(HTML), como vemos en la imagen siguiente, encontramos las propiedades:
![]() |
http://bit.ly/1fPvuz3 |
- Imagen de fondo: permite especificar una imagen de fondo para el documento. Dicha imagen se muestra en mosaico. Es importante al elegir una imagen de fondo tener en cuenta que según los colores de la imagen será necesario establecer unos u otros colores para el texto, así como que no es conveniente tener un gif animado como fondo.
- Fondo: permite especificar un color de fondo para el documento, pero dicho color solo se mostrará en el caso de no haber establecido ninguna imagen de fondo.
- Texto: es el color de la fuente.
- Vínculos: es el color que mostrará el texto de los vínculos.
- Vínculos visitados: es el color que mostrará el texto de los vínculos visitados.
- Vínculos activos: es el color que mostrará el vínculo cuando el cursor del ratón hace clic sobre el mismo.
- Márgenes: permiten establecer márgenes en el documento, es decir, la distancia entre donde empieza el contenido de la página y la ventana del navegador.
Podemos observar que
muchas propiedades HTML y CSS son similares. La diferencia es que CSS aplica
nuestra configuración utilizando reglas de estilo, mientras que HTML lo hace
con atributos HTML. Estos últimos están cayendo en desuso, ya que se tiende a
limitar el HTML al contenido, y no al diseño. Por eso, te desaconsejamos su
uso.
En la categoría Vínculos
(CSS) encontramos las propiedades:
![]() |
http://bit.ly/1gEMKfi |
- Fuente de vínculo: es el tipo de letra que mostrará el texto del vínculo.
- Tamaño: es el tamaño del texto de los vínculos.
- Color de vínculo: es el color de los vínculos, que ayuda al usuario a distinguir entre el texto normal y los vínculos que sirven de enlace a otras páginas.
- Vínculos visitados: es el color de los vínculos visitados, que permite distinguir al usuario si unos vínculos ya han sido visitados o no.
- Vínculos de sustitución: es el color del texto del vínculo cuando situamos el ratón encima del vínculo.
- Vínculos activos: es el color de los vínculos activos.
- Estilo subrayado: por defecto, cuando tenemos un texto con un vínculo asociado, el texto aparece subrayado, con esta opción podemos elegir otro tipo de estilo por ejemplo para que no aparezca subrayado.
En la categoría Encabezados
(CSS) encontramos la propiedad:
![]() |
http://bit.ly/LF9cH6 |
- Fuente de encabezado: permite establece el tipo de fuente de los encabezados.
El
resto propiedades hacen referencia al estilo cursiva o negrita, así como
al tamaño y color que queremos aplicar a cada tipo de encabezado.
En la categoría Título/Codificación
encontramos la propiedad:
- Título: es el título del documento, que aparecerá en la barra de título del navegador y de la ventana de documento de Dreamweaver
En la categoría Imagen
de rastreo encontramos las propiedades:
- Imagen de rastreo: permite establecer una imagen como fondo del documento, pero que sólo se mostrará en la ventana de documento de Dreamweaver, y nunca en un navegador. Dicha imagen se utiliza como plantilla gráfica sobre la que crear el documento.
- Transparencia: permite establecer la opacidad de la imagen de rastreo.
Bibliografía