[html] 12 - html 공부 정리3_사용자 입력 Form 태그

사용자 입력 Form 태그

입력 값 받기 <input>

• type
     • button
     • text
     • email
     • password
     • checkbox
     • radio
     • date
     • color
     • range
     • file

 

버튼, type=“button”

• 버튼을 생성
• 주로 특정 기능을 수행 시킬 때 사용

 

텍스트, type=“text”

• 텍스트 입력 값을 받는 폼을 생성
• 우리가 입력하는 ID 입력 부분?
• 텍스트 값을 입력 받아 전달하는 기능

 

패스워드, type=“password”

• 비밀번호 값을 받는 폼을 생성
• 입력 값을 자동으로 안보이게 처리
• 중요 or 비밀 텍스트 값을 전달하는 기능

 

체크 박스, type=“checkbox”

• 여러 선택지 중 여러 개를 선택 가능한 체크 박스 생성
• 속성
     • Name : 체크 박스의 이름, 같은 분류의 체크 박스는 같은 이름으로 설정
     • Checked : 화면 최초 로딩 시에 선택 된 상태로 로딩

 

라디오 버튼, type=“radio”

• 여러 선택지 중 하나만 선택 가능한 라디오 버튼 생성
• 속성
     • Name : 라디오 버튼의 이름, 같은 name 을 가지는 라디오 버튼은 하나만 선택이 가능 

                      → 하나를 선택하면 다른 선택 값이 취소 됨
     • Checked : 화면 최초 로딩 시에 선택 된 상태로 로딩

 

선택 메뉴를 만드는, <select>

• 선택 메뉴(드롭 다운)를 만드는 태그
• <select> : select 폼 생성
     • Name : select 박스의 이름
• <option> : select 폼의 옵션 값 생성
     • Value : 실제적으로 전달 되는 값
     • Selected : 최초에 선택 된 값으로 설정
• <optgroup> : option 을 그룹화
     • Label : optgroup 이름 설정
• Disabled : 옵션은 보이지만 선택을 못하도록 설정