Unidad 5. Ejercicio: Redefinir el estilo de una etiqueta


Objetivo

Practicar las operaciones necesarias para crear un estilo de clase y estilos para etiquetas.

Ejercicio

  1. Si no tienes abierto Dreamweaver, ábrelo para realizar el ejercicio.
  2. Si no aparece el panel Archivos, ábrelo a través del menú Ventana, opción Archivos.
  3. Selecciona el sitio Cocina en el panel Archivos.
  4. Haz doble clic sobre el documento postresemana.htm, que aparece en el panel Archivos.

    Se abrirá el documento en Dreamweaver.
  5. Haz clic sobre cualquier texto, sin seleccionar.
  6. Pulsa el botón CSS Designer, se abrirá el panel Diseñador de CSS.
  7. Pulsa el botón Agregar origen CSS del subpanel Fuentes, del menú emergente pulsa Definir en página.
  8. En el subpanel Selectores pulsa el botón Añadir selector y en el nombre del selector deja sólo body.
  9. En el subpanel Propiedades pulsa el icono Texto y en font-family selecciona Baskerville, Palatino Linotype, Palatino, Century Schoolbook L, Times New Roman, serif. Observa cómo cambia la tipografía de toda la página.
  10. Haz clic en la primera línea Postre de la semana.
  11. En el Inspector de propiedades CSS, pulsa el botón CSS Designer.
  12. En el subpanel Fuentes del Diseñador de CSS elige <style>.
  13. Pulsa el botón Añadir selector en el subpanel Selectores y escribe h1.
  14. En el subpanel Propiedades pulsa el icono Texto y establece la propiedad font-size en 140%.
  15. Vamos a editar la regla. Haz clic en el botón Editar regla del Inspector de Propiedades.
  16. En la categoría Fondo, en Background-color escribe #F9CA69. Pulsa Aceptar.
  17. Haz clic en la segunda línea Boniatos a la mallorquina.
  18. Pulsa el botón CSS Designer del Inspector de Propiedades y selecciona <style> del subpanel Fuentes.
  19. Pulsa el botón Añadir selector en el subpanel Selectores y escribe h2.
  20. En el subpanel Propiedades pulsa el icono Texto y modifica la propiedades font-style a italic.
  21. En en ese mismo subpanel establece la propiedad font-family en Cambria, Hoefler Text, Liberation Serif, Times, Times New Roman, serif.
  22. Haz doble clic en la propiedad color e introduce #6F9DBE.
  23. En el Inspector de propiedades CSS, en el desplegable Regla de destino elige body.
  24. Pulsa el botón Editar regla.En la categoría Fondo, en background-image elige la imagen fondococina.png que encontrarás en la carpeta imagenes del sitio. Pulsa Aceptar.
  25. Haz clic sobre el botón Guardar todo de la barra de herramientas o pulsa Ctrl + S para guardar los cambios.

Marzo-2015
Volver






Página inicial  Cursos Informática Gratuitos

Síguenos en:   Facebook       Sobre aulaClic            Política de Cookies


© aulaClic S.L. Todos los derechos reservados. Prohibida la reproducción por cualquier medio.