HTML Introduction | HTML Forms | HTML Input Element Attributes

Tags:

Input element attributes

The input element has many attributes. By using various attributes of the input element, you can control user input in more diverse ways. Representative attributes of the input element that are often used in HTML are as follows.

  1. value
  2. readonly
  3. disabled
  4. maxlength
  5. size

value attribute

The value attribute sets the initial value displayed in the input field of the input element.

사용자명: <input type="text" name="name" value="개발곰">

Run code

readonly attribute

The readonly attribute lets the user see the input field but prevents them from editing it. The difference from the disabled attribute is that the value is sent to the server when the submit button is pressed.

사용자명: <input type="text" name="name" value="개발곰" readonly>

Run code

disabled attribute

The disabled attribute prevents the user from using the input field at all. An input field with the disabled attribute cannot be used or clicked. Also, unlike readonly, the initial value is not sent to the server even when the submit button is pressed.

사용자명: <input type="text" name="name" value="개발곰" disabled>

Run code

maxlength attribute

The maxlength attribute sets the maximum number of characters that can be entered in the input field.

사용자명: <input type="text" name="name" value="개발곰" maxlength="10">

Run code

size attribute

The size attribute sets the visible size of the input element in the input field. Unlike maxlength, it only means the number of characters that the input field can show at once. Therefore, the maximum number of characters that can be entered depends on the maxlength attribute value and has nothing to do with the size attribute.

사용자명: <input type="text" name="name" value="개발곰" size="10">

Run code