Define un sitio nuevo con el menú Sitio, opción
Nuevo sitio... Recuerda que para el ejercicio es suficiente con que definas la carpeta que contendrá el sitio.
Crea un archivo Nuevo. Asegúrate que el tipo de archivo sea HTML5 y no contenga ningún diseño.
Utiliza el menú Insertar,
jQuery Mobile y luego la opción Página. Después haz clic bajo la estructura de la página en la vista Diseño y repite el procedimiento otras cuatro veces para un total de cinco páginas.
Graba el archivo en la carpeta del sitio con el nombre index.html
En la primera página #page, debes modificar el encabezado por
Parque Nacional Sierra Bicuerca
En donde dice Contenido, borra la palabra e inserta la imagen
panoramica.jpg. Pulsa ENTER.
Utiliza el menú Insertar,
jQuery Mobile y luego la opción
Vista de Lista con cuatro elementos. Conviértelos en el menú de navegación hacia las demás páginas.
En el pie de página coloca la leyenda "(La imagen del título pertenece a AMagill y se distribuye bajo licencia CreativeCommons)" Con las ligas correspondientes. Recuerda que puedes añadir estilos CSS en línea personalizados para cambiar el tamaño y el color de la fuente.
En la segunda página cambia la palabra Encabezado
por Bienvenidos. En la sección
Contenido copia y pega el texto de la página Parque Natural.
En el pie de página de la segunda a la última página debes borrar la palabra
Pie e insertar un botón con un icono de inicio con un vínculo a la página principal.
En la tercera página, cambia el encabezado por la palabra
Especies.
Borra la palabra Contenido y escribe "Estos son algunos de los habitantes del parque:", pulsa ENTER y usa la opción de menú
Insertar, jQuery Mobile, opción
Bloque que puede contraerse.
En el encabezado de cada sección del bloque escribe el nombre de cada animal (Nutria, Buitre Leonado y Gineta), en la sección
Contenido respectivo copia el texto de la página e inserta la fotografía que corresponda.
En la página cuatro cambia el Encabezado
por el título Reservas.
Inserta un Bloque que puede contraerse. En la primera sección del bloque escribe:
Visitas con guía e inserta dos cuadrículas de diseño, uno para los horarios y otro para las tarifas.
En el segundo bloque escribe en el encabezado "Aula Educativa (sólo grupos)" e inserta una cuadrícula de
Diseño. Recuerda que puedes crear estilos en línea CSS para añadir bordes y colores de fondo.
En el tercer bloque de esa página cambia el encabezado por la palabra
Contacto. Añade la leyenda "Si estás pensando visitar el parque con un grupo, por favor, rellena este formulario:" y pulsa ENTER.
Es importante que añadas primero el cuerpo del formulario (etiquetas <form></form> utilizando la opción de menú
Insertar, Formulario
y luego Formulario.
El formulario de contacto se compone de los siguientes elementos de jQuery Mobile en orden: Texto, Correo electrónico, Fecha, Regulador, Botón de opción (con 4 elementos), Casilla de verificación, Área de texto y botón Enviar.
Modifica las etiquetas de cada elemento por las correspondientes del formulario del sitio Parque Natural.
En la última página modifica el encabezado por la palabra
Galería.
Inserta en la sección de contenido un Bloque
que puede contraerse y en sus respectivas secciones de contenido inserta las fotografías que desees.
