최고의 HTML 양식 튜토리얼 2024년, 이 튜토리얼에서는 온라인 예,HTML 양식,HTML 양식 - 입력 요소,텍스트 필드 (텍스트 필드),암호 필드,라디오 버튼 (라디오 버튼),확인란을 선택 (체크 박스),단추 (버튼 제출) 제출,더 많은 예제,양식 인스턴스,HTML 양식 태그,를 배울 수 있습니다.
HTML 양식은 사용자 입력의 종류를 수집하기 위해 사용된다.
텍스트 필드 만들기 (텍스트 필드)
이 예는 HTML 페이지에서 텍스트 필드를 만드는 방법을 보여줍니다. 사용자가 텍스트 필드에 텍스트를 쓸 수 있습니다.
암호 필드 만들기
이 예제에서는 HTML 암호 필드를 만드는 방법을 보여줍니다.
(당신이 더 많은 예를 찾을 수 있습니다이 페이지의 맨 아래에.)
양식은 양식 요소를 포함하는 영역이다.
폼 엘리먼트는 예를 들어, 사용자가 양식에 내용을 입력 할 수 있도록하는 것이다 텍스트 필드 (텍스트 영역)을, 드롭 다운리스트, 라디오 버튼 (라디오 버튼) 등의 체크 박스 (체크 박스)와.
양식은 양식 태그 <FORM> 세트를 사용합니다 :
대부분의 경우에 사용되는 폼 태그를 입력 태그입니다이다 (<입력>).
입력 형태는 타입 속성 (타입) 정의이다. 다음과 같이 자주 사용하는 입력 유형은 다음과 같습니다
텍스트 필드 <입력 유형 = "텍스트"> 사용자가 문자, 숫자를 입력 할 때 설정하는 태그, 및 다른 형태의 콘텐츠를 텍스트 필드가 사용될 것이다.
브라우저는 다음을 표시합니다 :
참고 : 양식 자체가 표시되지 않습니다.또한, 대부분의 브라우저에서 텍스트 필드의 기본 폭은 20 자이다.
태그 <입력 유형 = "암호">에 의해 암호 필드를 정의합니다 :
브라우저는 다음과 같은 효과를 표시합니다
참고 : 암호 필드의 문자는 일반 텍스트로 표시, 대신 별표 또는 점으로하지 않습니다.
<입력 유형 = "라디오"> 태그는 테이블 만 상자 옵션 정의
브라우저는 다음과 같은 효과를 표시합니다
<입력 유형 = "체크 박스">는 체크 박스를 정의한다. 사용자는 몇 가지 주어진 선택에서 하나 또는 여러 개의 옵션을 선택해야합니다.
브라우저는 다음과 같은 효과를 표시합니다
제출 버튼을 정의 <입력 유형 = "제출">입니다.
사용자가 OK 버튼을 클릭하면 양식의 내용이 다른 파일로 전송됩니다. 폼 액션 속성 대상 파일의 파일 이름을 정의한다. 통상 처리에 관한 입력 데이터를 수신했을 파일의 액션 속성에 의해 정의 됨. :
브라우저는 다음과 같은 효과를 표시합니다
위의 텍스트 상자에 몇 글자를 입력하면, 다음 입력 데이터가 "html_form_action.php"페이지로 전송되는 확인 버튼을 클릭합니다. 이 페이지는 입력 한 결과를 표시합니다.
라디오 버튼 (라디오 버튼)
이 예는 HTML에서 라디오 버튼을 만드는 방법을 보여줍니다.
확인란을 선택 (체크 박스)
이 예제는 HTML 페이지에서 체크 박스를 만드는 방법을 보여줍니다. 사용자는 선택하거나 확인란을 선택 취소 할 수 있습니다.
간단한 드롭 다운 목록
이 예제는 HTML 페이지에서 간단한 드롭 다운 목록 상자를 만드는 방법을 보여줍니다. 드롭 다운 목록 상자는 선택 목록입니다.
사전 선택 드롭 다운 목록
이 예는 미리 선택된 값을 간단한 드롭 다운 목록을 만드는 방법을 보여줍니다.
텍스트 필드 (텍스트 영역)
이 예는 텍스트 필드 (여러 줄의 텍스트 입력 제어)를 만드는 방법을 보여줍니다. 사용자가 텍스트 필드에 텍스트를 쓸 수 있습니다. 단어의 쓰기 가능한 문자는 제한되지 않는다.
버튼 만들기
이 예제는 버튼을 만드는 방법을 보여줍니다. 당신은 사용자 정의 할 수 있습니다 버튼 텍스트 수 있습니다.
테두리 양식
이 예는 제목으로 데이터 주위에 상자를 그립니다하는 방법을 보여줍니다.
입력 상자와 버튼을 사용하여 양식을 확인
이 예는 양식 페이지를 추가하는 방법을 보여줍니다. 이 양식은 두 개의 입력 필드와 확인 버튼이 포함되어 있습니다.
체크 박스와 양식
이 양식은 두 개의 확인란, 확인 버튼이 포함되어 있습니다.
라디오 버튼과 양식
이 양식은 두 상자와 확인 버튼이 포함되어 있습니다.
양식에서 전자 메일 보내기
이 예는 양식에서 전자 메일을 보내는 방법을 보여줍니다.
새로운 기능 : HTML5 새 레이블
标签 | 描述 |
---|---|
<form> | 定义供用户输入的表单 |
<input> | 定义输入域 |
<textarea> | 定义文本域 (一个多行的输入控件) |
<label> | 定义了 <input> 元素的标签,一般为输入标题 |
<fieldset> | 定义了一组相关的表单元素,并使用外框包含起来 |
<legend> | 定义了 <fieldset> 元素的标题 |
<select> | 定义了下拉选项列表 |
<optgroup> | 定义选项组 |
<option> | 定义下拉列表中的选项 |
<button> | 定义一个点击按钮 |
<datalist> New | 指定一个预先定义的输入控件选项列表 |
<keygen> New | 定义了表单的密钥对生成器字段 |
<output> New | 定义一个计算结果 |