HTML 양식은 다양한 유형의 사용자 입력을 수집하는 데 사용됩니다. 매우 일반적으로 사용되는 레이블이며 양식 요소의 협력이 필요합니다.
<form>
.
input 元素
.
</form>
레이블에는 유형 속성이 포함되어 있습니다. 다양한 유형 속성 값에 따라 입력 필드에는 다양한 형식이 있습니다 (텍스트 필드, 확인란, 마스크 뒤의 텍스트 컨트롤, 라디오 버튼, 버튼 등).
공통 유형 속성
속성 값 | 기술 |
---|---|
단추 | 클릭 버튼 정의 (일반적으로 js에서 사용됨) |
체크 박스 | 확인란을 정의합니다. |
파일 | 파일 업로드를위한 입력 필드 및 "찾아보기"버튼을 정의합니다. |
숨겨진 | 셀 저장소의 입력 필드를 정의하십시오. |
영상 | 이미지 형태로 제출 버튼을 정의합니다. |
암호 | 비밀번호 필드를 정의하십시오. 이 필드의 문자는 마스킹됩니다. |
라디오 | 재설정 버튼을 정의합니다. 재설정 버튼은 양식의 모든 데이터를 지 웁니다. |
제출 | 제출 버튼을 정의합니다. 제출 버튼은 양식 데이터를 서버로 보냅니다. |
본문 | 사용자가 텍스트를 입력 할 수있는 한 줄 입력 필드를 정의합니다. 기본 너비는 20 자입니다. |
재설정 버튼 정의
<input type="reset" name="button" id="button" value="重置">
클릭하면 초기화 버튼이 위치한 폼의 내용이 기본값으로 초기화됩니다.
HTML5 새로운 입력 유형
속성 값 | 기술 |
---|---|
type =“email” | 사용자 입력 제한은 이메일 유형이어야합니다. |
type =“url” | 사용자 입력 제한은 URL 유형이어야합니다. |
-type =“월”- | -사용자 입력 제한은 월 유형이어야합니다- |
type = "날짜" | 사용자 입력 제한은 날짜 유형이어야합니다. |
type =“시간” | 사용자 입력 제한은 시간 유형이어야합니다. |
유형 =“숫자”– | -사용자 입력 제한은 숫자 유형이어야합니다- |
type =“tel” | 휴대 전화 번호 |
type = "검색" | 검색 창 |
참고 : 모든 주요 브라우저가 새 입력 유형을 지원하는 것은 아니지만 모든 주요 브라우저에서 이미 사용할 수 있습니다. 지원되지 않는 경우에도 일반 텍스트 필드로 표시 할 수 있습니다.
HTML과 XHTML의 차이점
HTML에서 입력 태그에는 종료 태그가 없습니다.
XHTML에서는 입력 태그가 제대로 닫혀 있어야합니다.
팁 및 참고 사항 : 입력 요소는 비어 있으며 태그 속성 만 포함합니다. label 요소를 사용하여 입력 요소의 레이블을 정의 할 수 있습니다.