본문 바로가기

개발/HTML

[HTML] Input 요소의 속성

728x90
반응형
input 요소의 속성

 

input 요소의 여러 속성을 사용하면 사용자가 입력하는 방식을 더욱 다양하게 제어할 수 있습니다.

 

value 속성

 

value 속성은 input 요소의 입력 필드(input field)에 나타나는 초깃값을 설정합니다.

 

<input type="text" name="language" value="HTML">

 

 

readonly 속성

 

readonly 속성은 사용자가 입력 필드를 볼 수는 있으나, 수정할 수는 없도록 설정합니다.(말 그대로 읽기 전용)

disabled 속성과 다른 점은  form 의 전송 버튼을 누르면 초깃값이 서버로 전송된다는 점입니다.

 

<input type="text" name="language" value="HTML" readonly>

 

 

disabled 속성

 

disabled 속성은 사용자가 입력 필드를 아예 사용할 수 없도록 설정합니다.

disabled 속성이 설정된 입력 필드는 사용할 수도 없고, 클릭할 수도 없습니다.

또한, readonly 속성과는 달리 form 의 전송 버튼을 눌러도 초깃값이 서버로 전송되지 않습니다.

 

<input type="text" name="language" value="HTML" disabled>

 

 

maxlength 속성

 

maxlength 속성은 입력 필드에 입력할 수 있는 문자의 최대 길이(length)를 설정합니다.

 

<input type="text" name="language" value="HTML" maxlength="100">

 

 

size 속성

 

size 속성은 입력 필드에 보여지는 input 요소의 크기(size)를 설정합니다.

maxlength 속성과는 달리 입력 필드가 한 번에 보여줄 수 있는 문자의 최대 개수만을 의미합니다.

따라서 입력될 수 있는 문자의 최대 길이는 maxlength 속성값에 따라 달라지며, size 속성과는 전혀 무관합니다.

 

<input type="text" name="language" value="HTML" size="20">

 

 

간단한 예제이므로 실습은 패쓰하겠습니다.

 

요기까지 임미다.

 

 

728x90

'개발 > HTML' 카테고리의 다른 글

HTML5 와 제이쿼리  (1) 2022.11.15
[HTML5] Form, Input 요소의 속성(작성중)  (0) 2022.09.07
[HTML] 입력 양식  (0) 2022.09.07
[HTML] 레이아웃  (0) 2022.09.06
[HTML] 블록과 인라인  (0) 2022.09.05
[HTML] 텍스트 요소 - 엔티티  (0) 2022.09.05
[HTML] 텍스트 요소 - 서식  (1) 2022.09.05
[HTML] HTML 기본 구조  (0) 2022.06.16