sábado, 28 de noviembre de 2015

Visualización visual y codificada en HTML de formularios web

PRIMER FORMULARIO WEB

VISUALIZACIÓN VISUAL


VISUALIZACIÓN CODIFICACIÓN HTML

<html>
<head>
<title>Formulario de registro - Mi web</title>
</head>
<body>
<h1>Formulario de registro</h1>
<form action="" method="get">
<p>
Nombre: <input type="text" name="nombre" maxlength="50" />
</p>
<p>
Apellidos: <input type="text" name="apellidos" maxlength="50" />
</p>
<p>
Sexo: <input type="radio" name="sexo" value="h" /> hombre <input type=
"radio" name="sexo" value="m" /> mujer
</p>
<p>
Correo: <input type="text" name="correo" maxlength="100" />
</p>
<p>
<input type="checkbox" name="info" checked="checked" /> Deseo recibir
información sobre novedades y ofertas
</p>
<p>
<input type="checkbox" name="condiciones" /> Declaro haber leido y
aceptar las condiciones generales del programa y la normativa sobre
protección de datos
</p>
<p>
<input type="submit" value="Enviar" />
</p>
</form>
</body>

</html>



SEGUNDO FORMULARIO WEB


VISUALIZACIÓN VISUAL







VISUALIZACIÓN CODIFICACIÓN HTML

<html>
<head>
<title>Formulario de registro - Mi web</title>
</head>
<body>
<h1>Formulario de registro</h1>
<form action="" method="get">
<p>
<label for="nombre">Nombre:</label> <input type="text" name="nombre"
id="nombre" maxlength="50" />
</p>
<p>
<label for="apellidos">Apellidos:</label> <input type="text" name="
apellidos" id="apellidos" maxlength="50" />
</p>
<p>
Sexo: <input type="radio" name="sexo" id="sexo-h" value="h" /> <label
for="sexo-h">hombre</label> <input type="radio" name="sexo" id="sexo-m
" value="m" /> <label for="sexo-m">mujer</label>
</p>
<p>
<label for="correo">Correo:</label> <input type="text" name="correo"
id="correo" maxlength="100" />
</p>
<p>
<label for="poblacion">Población:</label>
<select name="poblacion" id="poblacion">
<option>Alicante</option>
<option>Madrid</option>
<option>Sevilla</option>
<option>Valencia</option>
</select>
</p>
<p><label for="descripcion">Descripción:</label>
<textarea name="descripcion" id="descripcion" rows="6" cols="60"><
/textarea>
</p>
<p>
<input type="checkbox" name="info" id="info" checked="checked" />
<label for="info">Deseo recibir información sobre novedades y ofertas
</label>
</p>
<p>
<input type="checkbox" name="condiciones" id="condiciones" /> <label for="condiciones"> Declaro haber leido y aceptar las condiciones generales del programa y la normativa sobre protección de datos</label>
</p>
<p>
<input type="submit" value="Enviar" />
</p>
</form>
</body>
</html>
























No hay comentarios:

Publicar un comentario