본문 바로가기

html

input 태그의 속성

🔹 기본 속성들
속성 설명
type 입력 필드의 유형 (예: text, password, email, checkbox, radio, 등)
name 입력 필드의 이름. 폼 제출 시 서버에 전달되는 key가 됨
value 입력 필드의 기본값
id 고유 식별자 (CSS, JS에서 선택할 때 사용)
class CSS 클래스 지정


placeholder 입력 전 사용자에게 보여줄 힌트 텍스트
required 필수 입력 필드로 지정
readonly 읽기 전용 필드 (사용자는 값을 바꿀 수 없음)
disabled 비활성화된 필드 (제출 시 포함되지 않음)
maxlength 입력 가능한 최대 문자 수
minlength 입력해야 하는 최소 문자 수
pattern 정규 표현식으로 입력 형식 제한 가능
autocomplete 브라우저 자동완성 허용 여부 (on/off)


🔹 숫자나 날짜 관련 속성
(이건 type="number"나 type="date" 등에 자주 씀)

속성 설명
min 입력 가능한 최소값
max 입력 가능한 최대값
step 값의 증가/감소 단위 (예: step="0.1" → 소수 가능)


🔹 파일 업로드 관련
(파일 입력용 type="file" 일 때)

속성 설명
accept 허용할 파일 형식 지정 (예: accept="image/*" 또는 .pdf)
multiple 여러 파일 선택 가능하게 함


🔹 체크박스 / 라디오 버튼 전용
속성 설명
checked 기본으로 선택된 상태로 표시됨


예시 코드
<input type="text" name="username" placeholder="이름을 입력하세요" required maxlength="20" />