Formularios HTML

XHTML
El Lenguaje de Marcado de Hipertexto Extensible ()

se cre con el deseo de estandarizar el lenguaje de
desarrollo de pginas web y as brindar soluciones a
algunas de las limitaciones que tiene el HMTL 4, tales
como la flexibilidad en cuanto a la sintaxis, los
errores de cdigo e incompatibilidad con otras
tecnologas como dispositivos porttiles (PDA y
telfonos celulares, entre otros).
XHTML
El Lenguaje de Marcado de Hipertexto Extensible (XHTML) se cre
con el deseo de estandarizar el lenguaje de desarrollo de
pginas web y as brindar soluciones a algunas de las limitaciones
que tiene el HMTL 4, tales como la flexibilidad en cuanto a la
sintaxis, los errores de cdigo e incompatibilidad con otras
tecnologas como dispositivos porttiles (PDA y telfonos celulares,
entre otros).
Lo que pretende la World Wide Web (W3C) con el XHTML es
estandarizar el lenguaje de cdigo para que sea interpretado
desde cualquier dispositivo, en cualquier parte del mundo, en un
idioma universal.
DIFERENCIA ENTRE EL HTML Y EL XHTML

Los nombres de elementos y atributos deben escribirse en minsculas.
El XML es sensible a la utilizacin de maysculas y minsculas, el cdigo:

<BODY BgColor="#000000"> puede ser correcto en HTML, pero en
XHTML tiene que ser: <body bgcolor="#000000">
An si consideramos las DTDs que conforman el XHTML, sus elementos y
atributos estn definidos en minsculas, de modo que las etiquetas del
cdigo XHTML deben estar siempre en minsculas.
FORMULARIOS
Etiqueta que contiene el formulario
<form id=nombre formulario action="contacto.php" method="post">

</form>
action indica que tratamiento debern tener los datos recabados por el formulario
method controla la forma en que se envan los datos
post traslada los datos codificados
get vincula los datos al texto de la URL
FORMULARIOS ELEMENTOS INDEPENDIENTES

Etiqueta de agrupa una serie de elementos de formulario
<fieldset form=nombre formulario name=nombre fieldset>
</fieldset>
Etiqueta que coloca una leyenda para fieldset
<legend> </legend>
Etiqueta para colocar texto referente a un elemento de formulario y asocia a este
<label for=texto form=nombreformulario>
</label>
FORMULARIOS ELEMENTOS INDEPENDIENTES

Proporciona una imagen del avance de una tarea
<progress value="30" max="100"></progress>

max- especifica el valor mximo de un control
value define el valor actual de progreso del control
FORMULARIOS - ELEMENTOS DE TIPO INPUT

Presenta un campo de tipo texto para contener un correo electrnico
<label for="correo"> Escribe el correo: </label>

<input type="email" name="correo" id="correo" required="on" placeholder="Escribe aqu tu
correo" autofocus="autofocus" />

Presenta un campo de tipo texto para contener un valor de datos numricos
<p>
<label for="navegador"> Selecciona el nmero de navegadores que usas: </label>
<input type="number" name="navegador" id="navegador" max="6" min="1" step="1"
value="3" />
</p>

Presenta un campo de tipo texto para contener un valor de datos numricos, de forma grfica
desplazable
<p>
<label for="ncorreo"> Registra la cantidad de cuentas de correo que posees: </label>
<input type="range" name="ncorreo" id="ncorreo" max="10" min="1" step="1" value="3" />
</p>

Presenta un campo de tipo texto
<p>
<label for="nombre"> Registra t nombre: </label>
<input type="text" name="nombre" id="nombre" placeholder="Escribe tu nombre aqu" />

</p>

Presenta un campo de tipo password
<p>
<label for="clave"> Registra t contrasea: </label>
<input type="password" name="clave" id="clave" placeholder="Escribe tu contrasea aqu" />
</p>

Presenta un campo de tipo rea de texto
<p>
<label for="observaciones"> Registra tus observaciones: </label>
<textarea name="observaciones" id="observaciones" cols="60" rows="3" />
Escribe tus comentarios aqu

</textarea>
</p>
FORMULARIOS ATRIBUTOS TIPO INPUT

autofocus Especifica que elemento obtendr primero el foco, slo aplica a una etiqueta de un
formulario.
placeholder Especifica una cadena que se muestra mientras no se escriba nada en el campo
de texto
FORMULARIOS LISTA DE SELECCIN (COMBOBOX)

<p>
<label for="mascota"> Selecciona tu mascota: </label>
<select id="mascota" name="mascota" size="2">
<option> Perro</option>
<option> Gato</option>
<option> Pez</option>
<option> Pato</option>
</select>
</p>
FORMULARIOS LISTA DE BOTONES DE RADIO (RADIO

BUTTONS)
<p>
Selecciona el animal que ms te gusta:

<input type="radio" name="tipo_mascota" id="perro" value="1" />
<label for="perro"> Perro </label>
<input type="radio" name="tipo_mascota" id="gato" value="2" />
<label for="gato"> Gato </label>
<input type="radio" name="tipo_mascota" id="pez" value="3" />
<label for="pez"> Pez </label>
<input type="radio" name="tipo_mascota" id="pato" value="4" />
<label for="pez"> Pato </label>
</p>
FORMULARIOS LISTA DE CAJAS (CHECKBOX)

<p>
Selecciona los tipo de navegador que usas:
<input type="checkbox" name="tipo_nav" id="gch" value="1" />
<label for="gch"> Google Chrome </label>
<input type="checkbox" name="tipo_nav" id="opera" value="2" />
<label for="opera"> Opera </label>
<input type="checkbox" name="tipo_nav" id="ie" value="3" />
<label for="ie"> Internet Explorer </label>
<input type="checkbox" name="tipo_nav" id="mf" value="4" />
<label for="mf"> Mozilla Firefox </label>
</p>
BOTN PARA ENVIAR FORMULARIO

<input type="submit" id="envia" value="Enviar" />
BOTN PARA BORRAR INFORMACIN DEL FORMULARIO

<input type="reset" id="eliminar" value="Borrar informacin" />
BOTN
<input type="button" id="boton" value="Siguiente" />
BOTN COMO IMAGEN

<input type="image" id="image" src ="./images/next.jpg" alt="Siguiente" width="30"
height="30 />

Formularios HTML

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Formularios HTML

Uploaded by

Copyright:

Available Formats

XHTML

El Lenguaje de Marcado de Hipertexto Extensible ()

DIFERENCIA ENTRE EL HTML Y EL XHTML

El XML es sensible a la utilizacin de maysculas y minsculas, el cdigo:

<form id=nombre formulario action="contacto.php" method="post">

FORMULARIOS ELEMENTOS INDEPENDIENTES

FORMULARIOS ELEMENTOS INDEPENDIENTES

<progress value="30" max="100"></progress>

FORMULARIOS - ELEMENTOS DE TIPO INPUT

<label for="correo"> Escribe el correo: </label>

FORMULARIOS - ELEMENTOS DE TIPO INPUT

FORMULARIOS - ELEMENTOS DE TIPO INPUT

FORMULARIOS - ELEMENTOS DE TIPO INPUT

<input type="text" name="nombre" id="nombre" placeholder="Escribe tu nombre aqu" />

FORMULARIOS - ELEMENTOS DE TIPO INPUT

FORMULARIOS - ELEMENTOS DE TIPO INPUT

Escribe tus comentarios aqu

FORMULARIOS ATRIBUTOS TIPO INPUT

FORMULARIOS LISTA DE SELECCIN (COMBOBOX)

FORMULARIOS LISTA DE BOTONES DE RADIO (RADIO

Selecciona el animal que ms te gusta:

FORMULARIOS LISTA DE CAJAS (CHECKBOX)

BOTN PARA ENVIAR FORMULARIO

BOTN PARA BORRAR INFORMACIN DEL FORMULARIO

BOTN COMO IMAGEN

You might also like