type 속성은 입력 요소의 유형을 지정합니다.
참고: 이 속성은 필수는 아니지만 항상 사용해야 한다고 생각합니다.
<!DOCTYPE html><html lang=en><head> <meta charset=UTF-8> <meta name=viewport content=width=device-width,initial-scale=1.0> <meta http-equiv=X-UA -호환 가능한 콘텐츠=ie=edge> <title>색상 선택기</title></head><body> <input type=color id=color></body><script> document.querySelector(#color).onchange = function () { document.getElementById('color').click(); // 트리거하려면 클릭 이벤트를 추가해야 합니다. 그렇지 않으면 확인 버튼을 클릭해도 색상 변경이 트리거될 수 없습니다. .body.style.Background = this.value }</script></html> HTML 5 <input> 유형 속성을 살펴보겠습니다.속성 값
| 값 | 설명하다 |
|---|---|
| 단추 | 클릭 가능한 버튼 정의(주로 스크립트를 실행하기 위해 JavaScript와 함께 사용됨) |
| 체크박스 | 체크박스를 정의하세요. |
| 색상 | 색상 선택기를 정의합니다. |
| 날짜 | 날짜 필드 정의(달력 제어 포함) |
| 날짜시간 | 날짜 필드 정의(달력 및 시간 제어 포함) |
| 날짜/현지 | 날짜 필드 정의(달력 및 시간 제어 포함) |
| 월 | 날짜 필드의 월 정의(달력 제어 사용) |
| 주 | 날짜 필드의 주 정의(달력 제어 사용) |
| 시간 | 날짜 필드의 시간, 분, 초 정의(시간 제어 포함) |
| 이메일 | 이메일 주소에 사용되는 텍스트 필드 정의 |
| 파일 | 파일 업로드를 위한 입력 필드 및 찾아보기... 버튼 정의 |
| 숨겨진 | 숨겨진 입력 필드 정의 |
| 영상 | 이미지를 제출 버튼으로 정의 |
| 숫자 | 스피너 컨트롤을 사용하여 숫자 필드 정의 |
| 비밀번호 | 비밀번호 필드를 정의합니다. 필드의 문자가 마스크되어 있습니다. |
| 라디오 | 라디오 버튼을 정의합니다. |
| 범위 | 슬라이더 컨트롤을 사용하여 숫자 필드를 정의합니다. |
| 다시 놓기 | 재설정 버튼을 정의합니다. 재설정 버튼은 모든 양식 필드를 초기 값으로 재설정합니다. |
| 찾다 | 검색에 사용되는 텍스트 필드를 정의합니다. |
| 제출하다 | 제출 버튼을 정의합니다. 제출 버튼은 데이터를 서버로 보냅니다. |
| 전화 | 전화번호에 대한 텍스트 필드를 정의합니다. |
| 텍스트 | 기본. 사용자가 텍스트를 입력할 수 있는 한 줄 입력 필드를 정의합니다. 기본값은 20자입니다. |
| URL | URL에 사용되는 텍스트 필드를 정의합니다. |
위는 편집자가 소개한 HTML5 입력에 대한 새로운 유형 속성 색상 선택기의 예제 코드입니다. 질문이 있는 경우 메시지를 남겨주시면 편집자가 답변해 드릴 것입니다. 시간. 또한 VeVb 무술 웹사이트를 지원해 주신 모든 분들께 감사드립니다!