Elementos HTML

HTML posee distintos elementos los cuales tienen distintas funcionalidades y buscan el facilitar la estructuración de las páginas web.

Algunos de ellos son:

LISTA DESPLEGABLE

Una lista desplegable HTML (También conocidas como combo box en los lenguajes de programación) permiten a los usuarios de una página web, seleccionar un valor de una lista de opciones, como las que vez cuando te piden ingresar tu país de nacimiento.

Para crear una lista se usa la etiqueta SELECT, que usualmente debe llevar un nombre y un ID, el nombre se usa para que el programa que procese los datos del formulario pueda saber qué información está recibiendo. El ID se utiliza para poder acceder a ella por medio de JavaScript, por ejemplo, para validar si se ha llenado, para agregar o eliminar opciones dinámicamente, etc.

<select name="color">

<option>Verde</option>


<option>Azul</option>

<option>Rojo</option>

</select>

RADIO

Los elementos input de tipo radio se utilizan generalmente en grupos de radio: colecciones de botones de radio que describen un conjunto de opciones relacionadas.

Solo un botón de radio en un grupo dado puede estar seleccionado al mismo tiempo. Los botones de radio generalmente se representan como pequeños círculos, que se rellenan o resaltan cuando están seleccionados.

<input type="Radio" name="color">Rojo<p>

<input type="Radio" name="color">Verde<p>


<input type="Radio" name="color">Azul<p>

TEXT

Define un campo de texto, es el atributo más usado y se usa para introducir una línea de texto. Se puede introducir cualquier carácter, letras, números, etc. Los navegadores lo presentan como una caja de texto de una longitud de 20 caracteres. Esta longitud se puede variar con el atributo size, este valor se refiere a la longitud de visualización de la caja, pero el usuario puede introducir más caracteres; si queremos controlar esa cantidad podemos utilizar los atributos maxlength y minlength que indican el máximo y el mínimo de caracteres que puede introducir el usuario.

<input type="text" name="Color" id="Color">

NUMBER

Los elementos input del tipo number son usados para permitir al usuario ingresar un número. Éstos incluyen validación incorporada para rechazar entradas no numéricas.

El navegador puede optar por proveer flechas de pasos para permitir al usuario, usando su ratón o simplemente pulsando con la punta del dedo, incrementar y decrementar el valor.

<input type="number" name="edad">

CHECKBOX

Un checkbox en HTML es un tipo de input que le permite a los usuarios seleccionar opciones que pueden tener un valor binario, esto quiere decir que pueden estar marcadas o desmarcadas. Su estructura es bastante intuitiva y es muy importante hacer uso de ellos en situaciones en donde hay que tomar decisiones como «Aceptar términos y condiciones» o «seleccionar categorías de interés».

<input type="checkbox" name="Color1" value="Rojo">

<input type="checkbox" name="Color2" value="Verde">

<input type="checkbox" name="Color3" value="Azul">

BUTTON

El elemento HTML <input type="button"> es una versión específica del elemento <input>, que se usa para crear un botón en el que se puede hacer click sin ningún valor por defecto, es decir, no tiene un comportamiento predeterminado como por ejemplo <input type="reset"> .