Como hemos contado en el post anterior las etiquetas <form> y su cierre se componen de diferentes atributos básicos.
Puedes recordarlo en este link.
Puedes recordarlo en este link.
Los campos de la entrada de los formularios se define mediante el tag <input> y sus diferentes valores que nos permitirán utilizar varios tipos de cajas y de formas.
Las cajas de texto básicas se escribirá.
Hemos visto como el type= “text” le da a la caja una apariencia sencilla.
Este tipo de campos se usan para albergar informaciones cortas y concretas.
Podemos completar el estilo de esta caja gracias a los siguientes atributos:
size:
Mediante el atributo size podemos definir el tamaño de la caja.
Si lo que vamos a escribir no cabe en la caja, éste se desplazará pero sin que la caja varÃe su tamaño.
El texto irá desapareciendo por la izquierda.
Es decir, la apariencia de la misma.
maxlength:
Este atributo nos sirve para definir la cantidad máxima de letras que se pueden escribir en la caja.
No se podrán escribir en la caja más caracteres que los indicados por el maxlength.
value:
Define si queremos que en la ventana haya un texto ya pre escrito. Este texto puede ayudar al usuario a saber cual es el tipo de dato que te piden en ese campo.
name:
para ponerle un nombre al campo. Esto resulta muy útil a la hora de gestionar la información que nos llegue.
<textarea>
Es como una caja de texto sencilla, tipo “text”, pero en la que dejamos al usuario espacio de sobra para poder escribir un texto largo. Son útiles para que el usuario contacte con nosotros, plantee sus dudas o sugerencias, etc.
Su etiqueta es <textarea> y su correspondiente cierre </textarea>.
Todo lo que vaya dentro de estas etiquetas formará parte del texto.
Sus atributos básicos son “rows” y “cols” que servirán para definir el tamaño del textarea.
Además, no debemos olvidar el atributo “name”, que servirá para definir el nombre de este campo.
Un textarea llamado “comentarios” y con unas dimensiones de 10 filas y de 40 columnas, tendrÃa el código siguiente:
Quedará asÃ:
Botón de envÃo
Para enviar la información, el formulario necesita de un botón para enviar la información.
Los botones de envÃo se crean con la etiqueta “input” de tipo “submit”.
Además, podemos definir el texto que queremos que esté escrito en el botón.
Esto lo conseguimos con el atributo “value”.
Botón sencillo
Botón de resetear la información
Es posible que el usuario una vez avanzado el formulario, quiera reiniciarlo desde el principio y volver a escribir la información. Para ello es muy útil el botón para borrar la información.
El botón se escribe casi igual que el anterior, cambiando el type, que en el caso de estos botones es “reset” y cambiando el mensaje interno del botón, o sea, el “value”.
El ejemplo sencillo de este botón tendrÃa el siguiente código:
Puedes recordarlo en este link.
Puedes recordarlo en este link.
Los campos de la entrada de los formularios se define mediante el tag <input> y sus diferentes valores que nos permitirán utilizar varios tipos de cajas y de formas.
Las cajas de texto básicas se escribirá.
<input type="text">
Y se verá asi:Hemos visto como el type= “text” le da a la caja una apariencia sencilla.
Este tipo de campos se usan para albergar informaciones cortas y concretas.
Podemos completar el estilo de esta caja gracias a los siguientes atributos:
size:
Mediante el atributo size podemos definir el tamaño de la caja.
Si lo que vamos a escribir no cabe en la caja, éste se desplazará pero sin que la caja varÃe su tamaño.
El texto irá desapareciendo por la izquierda.
Es decir, la apariencia de la misma.
maxlength:
Este atributo nos sirve para definir la cantidad máxima de letras que se pueden escribir en la caja.
No se podrán escribir en la caja más caracteres que los indicados por el maxlength.
value:
Define si queremos que en la ventana haya un texto ya pre escrito. Este texto puede ayudar al usuario a saber cual es el tipo de dato que te piden en ese campo.
name:
para ponerle un nombre al campo. Esto resulta muy útil a la hora de gestionar la información que nos llegue.
<textarea>
Es como una caja de texto sencilla, tipo “text”, pero en la que dejamos al usuario espacio de sobra para poder escribir un texto largo. Son útiles para que el usuario contacte con nosotros, plantee sus dudas o sugerencias, etc.
Su etiqueta es <textarea> y su correspondiente cierre </textarea>.
Todo lo que vaya dentro de estas etiquetas formará parte del texto.
Sus atributos básicos son “rows” y “cols” que servirán para definir el tamaño del textarea.
Además, no debemos olvidar el atributo “name”, que servirá para definir el nombre de este campo.
Un textarea llamado “comentarios” y con unas dimensiones de 10 filas y de 40 columnas, tendrÃa el código siguiente:
<textarea name="comentarios" rows="10" cols="40">Escribe aquà tus comentarios</textarea>
Quedará asÃ:
Botón de envÃo
Para enviar la información, el formulario necesita de un botón para enviar la información.
Los botones de envÃo se crean con la etiqueta “input” de tipo “submit”.
Además, podemos definir el texto que queremos que esté escrito en el botón.
Esto lo conseguimos con el atributo “value”.
Botón sencillo
<input type="submit" value="Enviar información">
Se verá asÃ:Botón de resetear la información
Es posible que el usuario una vez avanzado el formulario, quiera reiniciarlo desde el principio y volver a escribir la información. Para ello es muy útil el botón para borrar la información.
El botón se escribe casi igual que el anterior, cambiando el type, que en el caso de estos botones es “reset” y cambiando el mensaje interno del botón, o sea, el “value”.
El ejemplo sencillo de este botón tendrÃa el siguiente código:
<input type="reset" value="Borrar información">