HTMLxumarhu.net/html_formularios.pdf · 5 Botón “reset” Boton reset
21
“HTML” Rogelio Ferreira Escutia
Transcript of HTMLxumarhu.net/html_formularios.pdf · 5 Botón “reset” Boton reset
“HTML”
Rogelio Ferreira Escutia
2
Formularios
3
Formulario Básico
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Formularios en HTML</title>
</head><body>
<h2>Página con Formulario</h2><form action="recibir.php" method = "post">
Nombre: <input type="text" name="nombre"/><br/><input type="submit" value="Enviar"/>
</form></body>
</html>
4
Formulario Básico
5
Botón “reset”
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Boton reset</title>
</head><body>
<h2>Boton reset</h2><form action="recibir.php" method = "post">
Nombre: <input type="text" name="nombre"/><br/><input type="submit" value="Enviar"/><input type="reset" value="Borrar"/>
</form></body>
</html>
6
7
Pre-rellenar campos
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Formularios</title>
</head><body>
<h2>Pre-rellenado de campos</h2><form action="recibir.php" method = "post">
Nombre: <input type="text" name="nombre" value="Escribe tu nombre aqui" /><br/>
<input type="submit" value="Enviar"/></form>
</body></html>
8
9
Longitud del campo
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Formularios</title>
</head><body>
<h2>Longitud de campos</h2><form action="recibir.php" method = "post">
Nombre: <input type="text" name="nombre" size="20" maxlength="30" /><br/>
<input type="submit" value="Enviar"/></form>
</body></html>
10
11
Campo password
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Formularios</title>
</head><body>
<h2>Campo password</h2><form action="recibir.php" method = "post">
Login: <input type="text" name="login" /><br/>Password: <input type="password" name="password"/><br/><input type="submit" value="Enviar"/>
</form></body>
</html>
12
13
Zona de texto
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Formularios</title>
</head><body>
<h2>Zonas de texto</h2><form action="recibir.php" method = "post">
Nombre: <input type="text" name="nombre" /><br/>Escribe tu comentario:<br/><textarea name="comentario" id="comentario" ></textarea><br/><input type="submit" value="Enviar"/>
</form></body>
</html>
14
15
Tamaño de zonas de texto
<!DOCTYPE html><html>
<head><meta charset="utf-8" /><title>Formularios</title>
</head><body>
<h2>Zonas de texto</h2><form action="recibir.php" method = "post">
Nombre: <input type="text" name="nombre" /><br/>Escribe tu comentario:<br/><textarea name="comentario" id="comentario" cols="50" rows="5" ></textarea><br/><input type="submit" value="Enviar"/>
</form></body>
</html>
16
17
Checkbox
<!DOCTYPE html><html>
<head><title>Formulario (Checkbox)</title><meta charset="utf-8" />
</head><body>
<h2>Formulario (checkbox)</h2> <form method="get" action="grabar.php">
Selecciona tus Pasatiempos:<br /><input name="peliculas" type="checkbox" checked="checked"
/>Películas<br /><input name="libros" type="checkbox" />Libros<br /><input name="internet" type="checkbox" />Internet<br /><br /><input type="submit" value="Enviar"/>
</form></body>
</html>
18
Checkbox
19
RadioButton
<!DOCTYPE html><html>
<head><title>Formulario (RadioButton)</title><meta charset="utf-8" />
</head><body>
<h2>Formulario (RadioButton)</h2> <form method="get" action="grabar.php">
Selecciona tu actividad favorita:<br /><input name="intereses" type="radio" value="peliculas"
checked="checked" />Películas<br /><input name="intereses" type="radio" value="libros" />Libros<br /><input name="intereses" type="radio" value="internet" />Internet
</form></body>
</html>
20
RadioButton
Rogelio Ferreira Escutia
Instituto Tecnológico de MoreliaDepartamento de Sistemas y Computación
Correo: [email protected] [email protected]
Página Web: http://antares.itmorelia.edu.mx/~kaos/http://www.xumarhu.net/
Twitter: http://twitter.com/rogeplusFacebook: http://www.facebook.com/groups/xumarhu.net/
