[HTML5] Input에 대해 알아보자
input은 단일태그이나 속성값에 따라 다양한 기능들을 활용할 수 있다.
form 태그와 같이 사용되는 경우가 많다.
- input type = "text" (문자열을 입력받을 때 사용된다) placeholder(흐리게 표시되며, 문자가 입력되면 사라진다)
- type = "button" 일반 버튼
- type = "reset" 리셋 버튼
- type = "submit" 전송 버튼(서버로 전송한다)
- type = "password" 비밀번호로 사용. 인풋값을 화면상에 대체 기호로 출력함
- type = "checkbox" 다중 선택을 이용할 때 사용
- type = "radio" 하나만 선택할 때 사용
- <label for = ""> 내용 </label>
라벨링을 통해 틱 박스 외의 항목의 이름을 클릭해도 틱이 되도록 설정 가능
- type="color" 색을 선택할 때 사용. 색상 정보는 16진수로 표현됨
- type="month" 년, 월을 표시
- type="week" 년, 주를 표시
- type="date" 년, 월, 일
- type="datetime-local" 년월일시분초
- type="time" 시분초
- type="email" 이메일형식의 택스트만 입력할 수 있음. 형태가 맞지 않을 시 알림창을 띄움
- type="search" 문자열을 입력할 때 뒤에 x 버튼이 생성
- type="file" 첨부파일 선택
- type="hidden" 값을 안보이게 숨김
- type="number" 숫자만 입력
- type="image" 그림을 넣어주는 태그. img 태그로 대체 가능.
src: 이미지의 주소(인터넷 사이트의 주소 또는 저장 경로)
alt: 이미지가 없을 때 보여질 글자
- type="range" 상태바를 이용하여 범위 값을 나타냄
