En este artículo, vamos a especificar el ancho del elemento de entrada. Esto se puede hacer usando el atributo de tamaño o el atributo de ancho para establecer el ancho de un elemento.
El atributo de tamaño funciona con los siguientes tipos de entrada : texto, búsqueda, teléfono, url, correo electrónico y contraseña y no en el tipo de fecha, imagen, hora, para estos podemos usar el atributo de ancho.
Cree un div en el que estamos poniendo nuestra entrada. Tomaremos 2 entradas nombres y fechas. Para ingresar el nombre, usaremos el tipo de entrada: atributo de nombre y tamaño. Para poner la fecha, usaremos el tipo de entrada: fecha y atributo de ancho (el atributo de tamaño no funcionará para el tipo de fecha).
Sintaxis: Para atributo de tamaño.
<input type="text" id="name" size=5>
Sintaxis: para el ancho de CSS.
<input type="text" id="name" style="width: 200px;">
Ejemplo: aquí usamos dos entradas con diferente tipo de entrada, es decir, nombre y fecha. El nombre usa el atributo de tamaño y la fecha usa el atributo de fecha. Ambas entradas se separan usando <br> y el estilo básico se usa en el atributo de cabeza.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
label {
font: 18px;
}
input {
margin: 7px;
padding: 2px
}
</style>
</head>
<body>
<h1>Specify width of input elements</h1>
<div>
<label for="name">Enter Name:</label>
<input type="text" id="name" size=10>
<br>
<label for="name">Enter Date:</label>
<input type="date" id="last name"
style="width: 200px;">
</div>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por darksiderrohan y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA