html에서 입력 태그의 속성은 무엇입니까?

HTML의 입력 태그 속성은 유형, 필수, 패턴, 단계, 자리 표시자, 읽기 전용, 비활성화, 크기, 양식, 최대 길이, 자동 초점, 최소, 최대 등입니다.

이 튜토리얼의 운영 환경: Windows7 시스템, CSS3&&HTML5 버전, Dell G3 컴퓨터.

먼저 html 입력 태그의 속성에 대해 이야기해 보겠습니다.

1.type: 이 속성은 입력 태그에 입력해야 하는 유일한 속성입니다. 물론 기본값을 공백으로 둘 수도 있습니다. 유형 = "텍스트"입니다. 구체적인 값은 나중에 논의됩니다.

2.required: 필드가 필수인지 여부를 표시합니다. 필드가 필수 = "required"(엄격 모드) 또는 필수(완화 모드)로 표시된 경우(ps: 다음 속성은 동일한 방식으로 작성되므로 하나씩 작성되지 않음) 이 필드의 값이 비어 있거나 입력된 값이 잘못된 값이면 양식을 제출할 수 없습니다. 유효하지 않은 값이란 무엇입니까? 패턴 속성을 살펴보세요.

더 빨리 배우고 더 확실하게 이해하려면 전체 네트워크 웹 프런트엔드 전체 스택 데이터베이스(일반 디렉터리)를 만드세요. 그럴 자격이 있습니다(지속적으로 업데이트됨)

3.pattern: 이 속성에는 JavaScript 스타일의 정규 표현식이 포함되어 있습니다. 공식의 경우 입력 내용은 정규식과 완전히 일치해야 합니다. 그렇지 않으면 입력 내용이 유효하지 않은 것으로 간주됩니다. 정규 표현식을 모르시나요? JavaScript 정규 표현식을 살펴볼 수 있습니다.

4.min max: 이 두 속성은 날짜, 시간, 시간 및 기타 입력은 물론 숫자와 범위에도 사용됩니다. 이름에서 알 수 있듯이 이들의 역할은 최대값과 최소값을 제한하는 것입니다.

5.step: max min과 유사하게 위아래로 클릭할 수 있는 버튼을 제공하는 것입니다. 예를 들어 현재 숫자는 1이고 step = "5"로 설정하면 위로 버튼을 클릭합니다. 6이 됩니다.

6.placeholder: 이 속성에 대해서는 특별히 언급할 내용이 없습니다. 일반적으로 사용자가 텍스트를 입력하면 입력한 텍스트로 덮어쓰게 됩니다.

7.readonly: 이름에서 알 수 있듯이 이 속성은 빈 양식 컨트롤을 편집할 수 없게 만듭니다. 여기서 편집할 수 없다는 것은 비활성화되었다는 의미가 아니라 텍스트를 편집할 수 없다는 의미입니다. 예를 들어 라디오와 체크박스는 본질적으로 편집할 수 없으므로 이 속성은 의미가 없습니다.

8.disabled: 이 속성은 양식 요소를 비활성화합니다. 이는 비활성화되어 be6d67dae90cc1ad6469079e163d0939을 제외한 모든 양식 요소를 완전히 비활성화합니다.

9.maxlength: 이 속성은 사용자가 입력하는 최대 단어 수를 제한하는 데 사용됩니다.

10.size: 더 이상 실질적인 효과가 없습니다. 이제 크기 제어는 거의 모두 CSS로 제어됩니다.

11.form: HTML5에서는 양식 컨트롤을 양식에 중첩할 필요가 없습니다. 새 양식 속성은 양식 요소를 페이지의 모든 양식과 연결할 수 있습니다. 양식에 중첩되어 다른 양식과 함께 제출할 수도 있습니다. 코드는 다음과 같습니다.

<form id="form1">
<p>
<label for="admin">admin</label>
<input type="text" id="admin" form="form1"/>
</p>
</form>

이런 식으로 양식과 입력이 연결됩니다. 입력에 양식 속성이 없으면 가장 가까운 양식과 연결됩니다.

12.autocomplete: 이름에서 알 수 있듯이 자동완성 기능은 사용자가 입력한 내용의 일부를 입력하고 나머지는 자동으로 완성되는 기능입니다. 브라우저는 사용자가 입력한 내용을 다음에 자동으로 완료할 수 있도록 저장해야 합니다.

13.autofocus: 이 속성은 페이지가 로드될 때 이 양식 컨트롤이 자동으로 포커스를 얻음을 의미합니다.

위는 html 입력 태그의 속성입니다.

확장 정보

이제 입력 태그의 사용법에 대해 이야기해 보겠습니다.

먼저 html 입력 태그의 예를 살펴보세요.

<form action="demo_form.asp">
用户名: <input type="text" name="fname"><br>
输入框: <input type="text" name="lname"><br>
<input type="submit" value="提交">
</form>

이 효과는 그림과 같습니다.

효과는 여전히 괜찮습니다. 이는 가장 간단한 입력 상자 스타일이기도 합니다. 오늘 이야기할 내용은 간단하다는 의미이기도 합니다.

html 입력 태그의 사용법 요약에 대해 이야기해 보겠습니다.

1. 텍스트 상자:

양식에서 텍스트 상자는 사용자가 다음과 같은 문자, 숫자 등을 입력할 수 있도록 사용됩니다. 사용자의 이름, 주소 등.

코드 형식은 다음과 같습니다:

<input type=”text” name=”...” size=”...” maxlength=”...” value=”...”/>

2. 비밀번호 상자:

는 비밀번호를 입력하는 데 사용되는 특수 텍스트 필드입니다.

코드 형식은 다음과 같습니다.

<input type=”password” name=”...”  size=”...” maxlength=”...” value=”...”/>

3. 숨겨진 필드:

숨겨진 필드는 웹 페이지 방문자에게 표시되지 않습니다. 양식이 제출되면 숨겨진 필드는 설정할 때 정의한 이름과 값으로 서버에 정보를 보냅니다.

코드 형식은 다음과 같습니다:

<input type=”hidden” name=”...” value=”...”/>

4. 라디오 버튼:

사용자가 제한된 수의 옵션 중 하나를 선택해야 하는 경우 라디오 버튼을 사용하세요. 예를 들어, 등록할 때 체중을 선택합니다.

코드 형식은 다음과 같습니다.

<input type=”radio” name=”...” value=”...”/>

5. 체크박스:

선택할 옵션 중 하나 이상을 선택할 수 있습니다. 각 확인란은 독립적인 요소이며 고유한 이름을 가져야 합니다.

코드 형식은 다음과 같습니다.

<input type=”checkbox” name=”...” value=”...”/>

6. 파일 업로드 상자:

코드 형식은 다음과 같습니다.

<input type”file” name=”...”>

注意：利用这项功能时，在 form 标签中要指定method属性。要把method 指定为post, enctype属性指定为 multipart/form-data。

说明：multipart 控件是否上传多文件

推荐学习：html视频教程

위 내용은 html에서 입력 태그의 속성은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!