Jak nastavit šířku vstupního pole text v HTML, CSS a JavaScript

27 října, 2020 admin 0 Comments

V tomto příspěvku se budeme vidět, jak nastavit šířku vstupního pole text v HTML, CSS a JavaScript.

nastavte šířku v HTML

v HTML, můžete použít atributwidth pro nastavení šířky prvku.,

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., Cílem je definovat třídu pro nastaveníwidth CSS vlastnost.

Upravit v JSFiddle

Případně můžete také použít CSS selektor vstupního textového pole pro nastavení width CSS vlastnost.

Upravit v JSFiddle

Nastavit šířku s JavaScript

S Javascriptem, můžete použít setAttribute() funkce nastavit hodnotu size atribut na vstupní textové pole.

editovat v JSFiddle

Můžete také dynamicky měnit šířku textového pole tak, aby odpovídala délce vstupu., 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.

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *