Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Formularios HTML Leonel Morales Díaz Ingeniería Simple [email_address] Disponible en: http://www.ingenieriasimple.com/intr...
Diálogo HTML
Formularios <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Un cuadro de texto</Title> </li></ul><ul><li>...
Formularios <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Un cuadro de texto</Title> </li></ul><ul><li>...
Cuadro de Texto – Text Box <ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40></P> </li></ul>
Area de Texto - TextArea <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLib...
Area de Texto - TextArea <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLib...
Palabra Clave - Password <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLib...
Valores Iniciales <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size...
Valores Iniciales <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size...
Checkboxes <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=CheckBox Checked=1> Habilitad...
Botones de Radio <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=CheckBox Name=Habilitad...
Botones de Radio <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=CheckBox Name=Habilitad...
Botones de Acción <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=Button Name=Guardar Va...
Otros Botones de Acción <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=Button Name=Guar...
Otros Botones de Acción <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Button AccessKey=y Type=But...
Otros Inputs <ul><li>Hidden – escondido </li></ul><ul><li><Input Type=Hidden Name=Usuario Value=“r méndez”> </li></ul><...
Tablas y Formularios ej031.html
Mejora de Formularios <ul><li>Utilizando tablas </li></ul><ul><li>Ver: </li></ul><ul><ul><li>ej032.html </li></ul></ul><ul...
Upcoming SlideShare
Loading in …5
×

Clase05

870 views

Published on

Revisión del código HTML que se utiliza para crear formularios o diálogos, control por control. También se muestra cómo se organiza visualmente un formulario utilizando tablas.

Published in: Education
no profile picture user

  • Be the first to comment

  • Be the first to like this

Clase05

  1. 1. Formularios HTML Leonel Morales Díaz Ingeniería Simple [email_address] Disponible en: http://www.ingenieriasimple.com/introprogra Copyright 2008 by Leonel Morales Díaz – Ingeniería Simple. Derechos reservados
  2. 2. Diálogo HTML
  3. 3. Formularios <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Un cuadro de texto</Title> </li></ul><ul><li></Head> </li></ul><ul><li><Body> </li></ul><ul><li><H1>Ingreso de Datos de Libros</H1> </li></ul><ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40></P> </li></ul><ul><li></Form> </li></ul><ul><li></Body> </li></ul><ul><li></HTML> </li></ul>ej019.html
  4. 4. Formularios <ul><li><HTML> </li></ul><ul><li><Head> </li></ul><ul><li><Title>Un cuadro de texto</Title> </li></ul><ul><li></Head> </li></ul><ul><li><Body> </li></ul><ul><li><H1>Ingreso de Datos de Libros</H1> </li></ul><ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40></P> </li></ul><ul><li></Form> </li></ul><ul><li></Body> </li></ul><ul><li></HTML> </li></ul>
  5. 5. Cuadro de Texto – Text Box <ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40></P> </li></ul>
  6. 6. Area de Texto - TextArea <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40><BR> </li></ul><ul><li>Abstract: <Textarea Rows=5 Cols=40 Name=Abstract> Ingrese un pequeño resumen del libro, puede ser la descripción de la contraportada. </Textarea> </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej020.html
  7. 7. Area de Texto - TextArea <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40><BR> </li></ul><ul><li>Abstract: <Textarea Rows=5 Cols=40 Name=Abstract>Ingrese un pequeño resumen del libro, puede ser la descripción de la contraportada.</Textarea><BR> </li></ul><ul><li>Descriptores: <Textarea Rows=2 Cols=40 Name=Descriptores></Textarea> </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej021.html
  8. 8. Palabra Clave - Password <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40><BR> </li></ul><ul><li>Abstract: <Textarea Rows=5 Cols=40 Name=Abstract>Ingrese un pequeño resumen del libro, puede ser la descripción de la contraportada.</Textarea><BR> </li></ul><ul><li>Descriptores: <Textarea Rows=2 Cols=40 Name=Descriptores></Textarea><BR> </li></ul><ul><li>Su Contraseña: <Input Type=Password Name=Contrasena Size=10> </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej022.html
  9. 9. Valores Iniciales <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40 Value=“Leyendas de Guatemala” ><BR> </li></ul><ul><li>Abstract: <Textarea Rows=5 Cols=40 Name=Abstract>Ingrese un pequeño resumen del libro, puede ser la descripción de la contraportada.</Textarea><BR> </li></ul><ul><li>Descriptores: <Textarea Rows=2 Cols=40 Name=Descriptores></Textarea><BR> </li></ul><ul><li>Su Contraseña: <Input Type=Password Name=Contrasena Size=10 Value=“nada” > </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej023.html
  10. 10. Valores Iniciales <ul><li><Form Name=Libros> </li></ul><ul><li><P>Nombre del Libro: <Input Type=Text Name=NombreLibro Size=40 Value=“Leyendas de Guatemala” ><BR> </li></ul><ul><li>Abstract: <Textarea Rows=5 Cols=40 Name=Abstract>Ingrese un pequeño resumen del libro, puede ser la descripción de la contraportada.</Textarea><BR> </li></ul><ul><li>Descriptores: <Textarea Rows=2 Cols=40 Name=Descriptores></Textarea><BR> </li></ul><ul><li>Su Contraseña: <Input Type=Password Name=Contrasena Size=10 Value=“nada” > </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>“ hardcode a password”, incluír una contraseña en código. Mala Práctica
  11. 11. Checkboxes <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=CheckBox Checked=1> Habilitado </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej024.html
  12. 12. Botones de Radio <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=CheckBox Name=Habilitado Checked=1>Habilitado<BR> </li></ul><ul><li>Tipo de Pasta: </li></ul><ul><li><Input Type=Radio Name=Pasta Checked=1> Suave </li></ul><ul><li><Input Type=Radio Name=Pasta> Dura </li></ul><ul><li><Input Type=Radio Name=Pasta> Empastado </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej025.html
  13. 13. Botones de Radio <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=CheckBox Name=Habilitado Checked=1>Habilitado<BR> </li></ul><ul><li>Tipo de Pasta: </li></ul><ul><li><Input Type=Radio Name=Pasta Checked=1>Suave </li></ul><ul><li><Input Type=Radio Name=Pasta >Dura </li></ul><ul><li><Input Type=Radio Name=Pasta >Empastado<BR> </li></ul><ul><li>Procedencia: </li></ul><ul><li><Input Type=Radio Name=Procedencia >Donación </li></ul><ul><li><Input Type=Radio Name=Procedencia Checked=1>Remesa </li></ul><ul><li><Input Type=Radio Name=Procedencia >Préstamo </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej026.html
  14. 14. Botones de Acción <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=Button Name=Guardar Value=Guardar> </li></ul><ul><li><Input Type=Button Name=Salir Value=Salir> </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej027.html
  15. 15. Otros Botones de Acción <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Input Type=Button Name=Guardar Value=Guardar> </li></ul><ul><li><Input Type=Button Name=Salir Value=Salir><BR> </li></ul><ul><li><Input Type=Submit Name=GuardaSale Value=“Guardar y Salir”> </li></ul><ul><li><Input Type=Reset Name=Cancelar Value=“Cancelar”> </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej028.html
  16. 16. Otros Botones de Acción <ul><li><Form Name=Libros> </li></ul><ul><li><P>... </li></ul><ul><li><Button AccessKey=y Type=Button>Guardar <U>y</U> Nuevo</Button> </li></ul><ul><li></P> </li></ul><ul><li></Form> </li></ul>ej029.html
  17. 17. Otros Inputs <ul><li>Hidden – escondido </li></ul><ul><li><Input Type=Hidden Name=Usuario Value=“r méndez”> </li></ul><ul><li>File – archivo </li></ul><ul><li><Input Type=File Name=Portada Size=30> </li></ul>ej030.html
  18. 18. Tablas y Formularios ej031.html
  19. 19. Mejora de Formularios <ul><li>Utilizando tablas </li></ul><ul><li>Ver: </li></ul><ul><ul><li>ej032.html </li></ul></ul><ul><ul><li>ej033.html </li></ul></ul><ul><ul><li>ej034.html </li></ul></ul><ul><ul><li>ej035.html </li></ul></ul>

×