Sirve para especificar un valor inicial para el input.
<form action="">
Nombre:<br>
<input type="text" name="firstname" value="Kiko">
</form>
Sirve para especificar que un input no se puede cambiar
<form action="">
Nombre:<br>
<input type="text" name="firstname" value="Kiko" readonly>
</form>
El input queda deshabilitado, no se puede clicar, y el valor no se envía cuando se envía el formulario.
<form action="">
Nombre:<br>
<input type="text" name="firstname" value="Kiko" disabled>
</form>
Especifica cómo de ancho tiene que ser el input, en número de caracteres.
<form action="">
Nombre:<br>
<input type="text" name="firstname" value="Kiko" size="30">
</form>
Establece el máximo número de caracteres en el input.
<form action="">
Nombre:<br>
<input type="text" name="firstname" value="Kiko" maxlength="10">
</form>
HTML5 incluyó algunos nuevos atributos para los input:
autocompleteautofocusformformactionformenctypeformmethodformnovalidateformtargetheightywidthlistminymaxmultiplepattern(regexp)placeholderrequiredstep
También incluyo estos para el <form>
autocompletenovalidate
Define si el formulario o el input debería de tener autocompletado o no por parte del navegador. Los valores son on o off.
<form action="/action_page.php" autocomplete="on">
Nombre:<input type="text" name="name"><br>
Apellidos: <input type="text" name="lastname"><br>
E-mail: <input type="email" name="email" autocomplete="off"><br>
<input type="submit">
</form>
Este atributo es para el <form> y especifica que los datos no tienen que validarse en el envío.
<form action="/action_page.php" novalidate>
E-mail: <input type="email" name="email">
<input type="submit">
</form>
Este atributo especifica que automáticamente ese input tenga el foco cuando carga la página.
Nombre:<input type="text" name="name" autofocus>
Indica que un input pertenece a un formulario, este input puede estar fuera del elemento <form>.
<form action="/action_page.php" id="form1">
Nombre: <input type="text" name="name"><br>
<input type="submit" value="Enviar">
</form>
Apellidos: <input type="text" name="lastname" form="form1">
Especifica la URL que procesa el formulario cuando sea enviado, es decir, se sobreescribe el action del <form>.
Se usa en los input de tipo submit e image.
<form action="/action_page.php">
Nombre: <input type="text" name="name"><br>
Apellidos: <input type="text" name="lastname"><br>
<input type="submit" value="Enviar"><br>
<input type="submit" formaction="/action_page2.php"
value="Enviar como administrador">
</form>
Especifica la codificación de los datos cuando se envían (solo con POST). Sobreescribe el enctype del <form>. Y se usa en los input de type submit e image.
<form action="/action_page_binary.php" method="post">
Nombre: <input type="text" name="name"><br>
<input type="submit" value="Enviar">
<input type="submit" formenctype="multipart/form-data"
value="Enviar como Multipart/form-data">
</form>
Define el método HTTP a usar cuando se envían los datos. Sobreescribe el method del <form>. Y se usa en los input de tipo submit e image.
<form action="/action_page.php" method="get">
Nombre: <input type="text" name="name"><br>
Apellidos: <input type="text" name="lastname"><br>
<input type="submit" value="Enviar">
<input type="submit" formmethod="post" value="Enviar usando POST">
</form>
Sobreescribe el atributo novalidate del form.
<form action="/action_page.php">
Correo electrónico: <input type="email" name="email"><br>
<input type="submit" value="Enviar"><br>
<input type="submit" formnovalidate value="Enviar sin validación">
</form>
Sobreescribe el atributo target del form.
<form action="/action_page.php">
Nombre: <input type="text" name="name"><br>
Apellidos: <input type="text" name="lastname"><br>
<input type="submit" value="Enviar">
<input type="submit" formtarget="_blank"
value="Enviar en una nueva ventana">
</form>
Estos dos atributos sirve para especificar el ancho y alto de un input de tipo image.
<input type="image" src="https://kikopalomares.com/kikopalomares.jpg" alt="Enviar" width="48" height="48"/>
Hace referencia a un <datalist> que contiene una lista predefinida con opciones para ese input.
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
Establecen el mínimo y máximo valor que puede tomar el input. Funciona con los tipos: number, range, date, datetime-local, month, time y week.
Fecha antes de 1980-01-01:
<input type="date" name="bday" max="1979-12-31">
Fecha después de 2000-01-01:
<input type="date" name="bday" min="2000-01-02">
Cantidad (entre 1 y 5):
<input type="number" name="quantity" min="1" max="5">
Permite al usuario introducir más de un valor en el input. Los tipos con los que funciona son: email y file.
Selecciona imágenes: <input type="file" name="img" multiple>
Define una expresión regular que se usará para validar el input. Funciona con los tipos: text, search, url, tel, email y password.
Código de país: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Tres letras">
Especifica un texto en el input que se ve antes de rellenarlo. Funciona con los tipos text, search, url, tel, email y password.
<input type="text" name="name" placeholder="Nombre">
Determina si el input debe ser rellenado antes de enviar los datos del formulario. Funciona con los tipos: text, search, url, tel, email, password, date pickers, number, checkbox, radio y file.
Username: <input type="text" name="username" required>
Especifica el intervalo entre los que cambian los números de un input. Funciona con los tipos: number, range, date, datetime-local, month, time y week.
<input type="number" name="points" step="3">
