Embed Size (px)
Citation preview
Sergio Cubero
Introducción a las Páginas Web
Sesión 3Sesión 3
12:00-12:30:
12:30-13:00:
13:00-13:30: 12:00-13:30:
13:30-14:00:
14:00-14:30:
Tablas
Formularios
Plantillas del Frontpage
Crear una sección de descarga.
Utilidades
¿Sabes crear un nuevo sitio web y conectarte a él?
¿Sabes crear o modificar enlaces a páginas, correos o archivos?
¿Sabes trabajar con las plantillas de la UV?
¿Sabes añadir/borrar nuevas páginas?
¿Sabes añadir imagenes?
¿Sabes añadir/cambiar secciones de texto en las plantillas?
¿Sabes añadir/cambiar el título a la página web?
Encuesta:
Creamos nueva carpeta en el “SITE”
Importar Archivo al Web
Creamos un nuevo vinculo pero esta vez nos llevará a un archivo a descargar
Enlace
Resultado
Creación y edición de Tablas
Sirven para organizar el contenido en sentido horizontal
Controlan con precisión el diseño de la páginaCrea una cuadrícula donde colocar los diferentes elementos de la web (texto, imagénes…)
Es importante preparar en papel el diseño previo de la web a construir con tablas.
Casi siempre trataremos de que los bordes de la tabla no se vea por lo que los pondremos a 0
Bordes de las Tablas
Desde Menú “Tabla” Desde el botón derecho del ratón “Propiedades de la tabla”
Las tablas centradas en la página y con un ancho de 728 px.
Autoformato de Tablas
Una vez creada la tabla la seleccionamos toda con el ratón y ….
Convertir texto en Tablas
Eliminar Tablas
La seleccionamos con el cursor del ratón y mediante el botón derecho “Eliminar celdas”
Insertar Filas
Insertar Columnas
Eliminar Celdas
Combinar celdas
Dividir celdas
Trabajar con tablas
Anidar Tablas
Trabajar con el espacio
Crear nuestro sitio WebCrear nuestro sitio Web
Creación de páginas con plantillas del Frontpage
Conjunto Web
Aplicar Temas
Propiedades de la Barra de Vínculos
Menú de exploración
Formularios “FormMail”Formularios “FormMail”http://www.uv.es/ciuv/cas/web/htmlgen.html
<FORM ACTION="/cgi-bin/FormMail.pl" METHOD=POST>
<!-- En la variable "recipient" pon la direccion de destino del mensaje -->
<INPUT TYPE="hidden" NAME="recipient" VALUE="[email protected]">
<!-- En la variable "subject" pon el asunto que quieres que aparezca en el mensaje -->
<INPUT TYPE="hidden" NAME="subject" VALUE="Formulario de prueba">
<!-- Aqui ya puedes incluir tus campos del formulario que desees -->
<!-- Si una de las variables se llama "email", el mensaje llegara con esa direccion de remite -->
Quién envía el mensaje:<br> <INPUT TYPE="text" NAME="email" VALUE="[email protected]"><p>
<!-- Si una de las variables se llama "realname", el mensaje llegara con esa nombre de remitente --> Nombre de quién envía el mensaje:<br> <INPUT TYPE="text" NAME="realname" VALUE="MiNombre Apell1 Apell2"><p> Un campo de texto sencillo:<br> <INPUT TYPE="text" NAME="text1" VALUE="Algo interesante"><p>
<INPUT TYPE="reset" VALUE="Borrar"><INPUT TYPE="submit" VALUE="Enviar">
</FORM>
Barra de formato
Salto de línea
Parrafos
Justificado
Insertar Imagen de FondoInsertar Imagen de Fondo
Sustituir Texto web (Buscar/Reemplazar)
A veces en nuestro sitio web necesitaremos buscar y reemplazar alguna palabra porque ha cambiado
Estilo dentro de la página web
Hoja de estilo ubicada dentro de la página web
Lugar para modificar las reglas CSS
Vincular la página o páginas a otra hoja de estilos
Insertar Fecha y hora
Insertar componentes dinámicos
Añadir lineas Horizontales con Frontpage
Utilizadas para la separación de los contenidos
Propiedades de la línea Horizontal (Botón derecho)
AGRADECIMIENTOS AGRADECIMIENTOS
RUEGOS Y PREGUNTASRUEGOS Y PREGUNTAS
