Unidad 11. Hojas de estilos (II)


Modificar y aplicar una hoja de estilos.

  

Para modificar una hoja de estilos tenemos que modificar sus elementos.

Por ejemplo, si hacemos clic en body y después en Modificar, podemos ver ese estilo y modificarlo. body es una etiqueta HTML que se refiere al cuerpo del documento, como ya hemos visto.

Las características con que cuenta el estilo están en el apartado Descripción.

 

 Si pulsamos en el botón Formato podemos modificar el estilo asociado a la etiqueta:

Aquí nos aparecen todas las posibles modificaciones.

Podemos cambiar la Fuente... (tipo, color, tamaño,etc), el tipo de Párrafo..., etc.

Naturalmente, modificaremos sólo los que necesitemos. Vamos a guardar la hoja de estilos y vamos a usarla.

Pulsamos en guardar y guardamos la hoja como hojaestilos.css.

Vamos a aplicar la hoja de estilos a una página web. Creamos la siguiente página:

Es importante que marquemos el título como encabezado H4.

Para ello lo seleccionamos y en la barra de formato hacemos clic en Estilo y clic en H4 (o encabezado4).

Si no lo hacemos, el título será considerado como texto normal y se le aplicará el estilo del texto.

barra de formato

Ahora vamos a indicarle a FrontPage que asocie la página web a la hoja de estilos.

Hacemos clic en el menú Formato à Vínculos de hoja de estilos.

Nos aparece la siguiente pantalla, en la que tenemos que pulsar en Agregar y buscar el fichero de hoja de estilos que antes hemos guardado. Hacemos clic en Aceptar.

 

 

Veamos un par de imágenes de la ventana antes y después de agregar la hoja de estilos:

 

          

Al aplicarse la hoja de estilos, la página web tiene ahora el siguiente aspecto:

Como podemos comprobar, se han aplicado las características que hemos visto antes.

Vamos a cambiarlas.

Abrimos la hoja de estilos y pulsamos en el botón Estilo que queda en medio de la página.

Pinchamos en body y pulsamos en Modificar. En Formato elegimos Fuente.... En la ventana de Fuente elegimos Times New Roman y el color negro.

Le damos a Aceptar hasta que volvamos a la hoja de estilos.

 

 

Ahora el texto tiene otro tipo de letra y otro color.

Grabamos los cambios pulsando en .

 

Para practicar los distintos aspectos explicados en el tema puedes realizar el ejercicio paso a paso Hojas de estilos.

  Ejercicios del Tema 11.

  Prueba evaluativa del Tema 11.




   

Pág. 11.2

Aviso legal: Este curso es gratuito siempre que se visualice desde la página Web de aulaClic. No está permitido descargar el curso.
© aulaClic S.L. Todos los derechos reservados. Prohibida la reproducción por cualquier medio.
Julio-2003.