Come impostare la larghezza di una casella di immissione testo in HTML, CSS e JavaScript

0 Comments

In questo post, vedremo come impostare la larghezza di una casella di immissione testo in HTML, CSS e JavaScript.

Imposta larghezza in HTML

In HTML, è possibile utilizzare l’attributowidth per impostare la larghezza di un elemento.,

label for=”name”>Enter a value:</label>

<input type=”text” style=”width: 200px;”>
</body>
</html>

Edit in JSFiddle

Alternatively, you can also use the size attribute to define the width of the <input>.,ody>

<label for=”name”>Enter a value:</label>
<input type=”text” size=”20″>
</body>
</html>

Edit in JSFiddle

Set width with CSS

It is good practice to separate CSS from HTML markup., L’idea è quella di definire una classe per impostare width proprietà CSS.

Modifica in JSFiddle

In alternativa, puoi anche usare il selettore CSS di una casella di testo di input per impostare la proprietà CSS width.

Modifica in JSFiddle

Imposta larghezza con JavaScript

Con JavaScript, è possibile utilizzare la funzionesetAttribute() per impostare il valore dell’attributosize nella casella di testo di input.

Modifica in JSFiddle

Puoi anche modificare dinamicamente la larghezza di una casella di testo in modo che corrisponda alla lunghezza dell’input., This can be easily done by setting the size attribute on key events.

Edit in JSFiddle

(21 votes, average: 5.00 out of 5)

Thanks for reading.


Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *