Day2_VSCODE_HTML input 태그

type 속성

🟢 text: 문자를 입력받는 글 상자

🟢password: 비밀번호를 입력받는 글 상자

🟢radio: 여러개의 옵션 중에서 단 하나의 옵션만 선택하게 하는 버튼
그룹을 맺기 위해 name 속성의 값을 동일하게 해야 한다.
ex) 남녀 선택하는 체크박스

🟢checkbox: 여러개의 옵션 중에서 다수의 옵션을 입력 받을 수 있도록 하는 버튼 
그룹을 맺기 위해 name 속성의 값을 동일하게 해야 한다.
(name은 같아야하고, value는 달라야함)

🟢file: 원하는 파일을 서버로 전송하기 위한 글 상자

🟢readonly: 데이터를 볼 수 있으나, 수정할 수 없게 설정 (서버로 데이터가 전달됨)

🟢 disabled: 입력필드를 사용할 수 없게 설정 (서버로 데이터가 전달되지 않음)

🟢required: 데이터를 submit 할 때 데이터를 필수로 입력하도록 강제하는 설정

🟢email: 이메일을 입력받는 글상자 (@ 필요)
🟢url: 웹사이트를 입력받는 글상자 (http 필요)
🟢tel: 전화번호를 입력받는 글상자 (모바일에서 숫자 키패드를 사용)

🟢date: 원하는 날짜를 입력받는 글상자

🟢number: 원하는 숫자를 입력받는 글상자
<input type = 'number' min ='최소값 'max ='최대값' step ='증가값'>

🟢color: 원하는 색상을 입력받는 요소 (선택한 색상은 16진수 rgb값으로 서버로 전달)

🟢search: 검색어를 입력받는 글상자

🟢range: 일정 범위 안에 값만을 입력하는 조절바 
<input type = 'range' min ='최소값' max ='최대값' value '현재값'>

🟢hidden: 보이지는 않으나, 서버에 값을 전달하고 싶을 때 사용하는 글상자

🟢button: 이벤트가 없는 일반버튼
🟢reset: 입력받은 데이터를 초기화
🟢submit: 입력받은 데이터를 서버에 제출하는 버튼

일반적 속성

🟢name: 요소의 이름을 설정, 서버에서 값을 전달 받을 때 key로 사용

🟢id: 요소의 유일한 이름을 설정 , HTML문서에서 해당 요소의 스타일을 주거나 동적인 프로그래밍을 할때 사용(HTML 문서 내에서 다른 요소와 같은 ID를 가질수 없음)

🟢maxlength: 값의 최대길이를 설정(input태그에 쓸수있는 갯수 제한)

🟢placeholder: 입력 전 특정 데이터를 입력하도록 안내하는 값을 설정

🟢value: 서버로 전달될 입력 양식의 값을 설정

🟢checked: radio or checkbox중에서 미리 선택하는 옵션을 선택하는 값을 설정