1. form
<form action="처리할페이지주소" method="get/post"></form>
- action ; 입력받은 데이터를 처리할 서버 상의 스크립트 파일의 주소 명시
- method ; 입력받은 데이터를 서버에 전달할 방식을 명시
get ; 주소에 데이터를 추가하여 전달하는 방식, 데이터가 주소 입력창에 그대로 나타남, 데이터 크기 제한적
post ; 데이터를 별도로 첨부하여 전달하는 방식, 데이터가 외부에 드러나지 않고, 데이터 크기 제한 x
2. input
<input type="타입유형" name="이름">
1. text ; 한 줄의 텍스트 입력
2. password ; 한 줄의 비밀번호 입력(별표처리)
3. radio ; 옵션 선택
- name="" 통일해주어야함, value =""; 선택했을 때 제출되는 값, checked ; 기본 선택
4. checkbox ; radio와 같음 but 다중 선택 가능
5. file ; 파일 선택 가능
6. <select></select> ; 여러 리스트 중 선택 가능
- select>option*n ; value="" 선택했을 때 제출되는 값, selected ; 기본 선택
7. <textarea></textarea> ; 여러 줄의 텍스트 입력
- rows ="", cols=""로 열과 행 설정. <textarea></textarea>사이에 글자를 넣어 기본 값 넣을 수 있음
8. <button></button> ; 버튼
- onclick="" ; 눌렀을 때 반응 설정, ex) alert('xxx'), <button></button>사이에 글자 넣을 수 있음
9. submit ; form의 action속성으로 지정된 서버 페이지로 전송
- value="" ; 버튼의 내용
10. <fieldset></fieldset> ; form요소와 관련된 데이터들을 하나로 묶어줌
- <legend> ; fieldset 요소 안에서만 사용 가능하며, fieldset 요소의 제목을 나타냄
input 속성
- value ; 입력필드에 나타나는 초깃값
- readonly ; 입력필드를 볼 수는 있으나, 수정할 수는 없음
- disabled ; 입력필드 사용 불가
- maxlength ; 최대 길이 설정
- size ; 한 번에 보여줄 수 있는 문자 최대 개수 설정
+ 새로 추가된 Input 요소의 type
- number, range, color, date, time, datetime-local, month, week, email, url, tel, search
+ 새로 추가된 Input 요소
- datalist ; 미리 정의된 옵션 리스트 명시
- keygen ; 사용자가 인증할 수 있는 안전한 방법 제공
- output ; 계산 결과 바로바로 표시
+ 새로 추가된 input 속성
- autocomplete ; 저장된 정보를 바탕으로 자동 완성
- novalidate ; 그 정보가 유효한지 아닌지 검사 ex) url, email
- autofocus ; 페이지 로드 시, 자동으로 포커스 가도록 함
- placeholder ; input요소에 입력되어야 할 값에 대한 힌트 제공
- required ; 반드시 입력되어야 할 필수 input요소 명시
'WebProgramming > HTML' 카테고리의 다른 글
[HTML] HTML 작성 가이드라인 & 팁 (0) | 2022.06.02 |
---|---|
[HTML] 전역 속성 (0) | 2022.05.24 |
HTML 글자/단락 태그 + CSS (0) | 2022.05.05 |
HTML 기본 문법 정리 (0) | 2022.04.25 |
1. form
<form action="처리할페이지주소" method="get/post"></form>
- action ; 입력받은 데이터를 처리할 서버 상의 스크립트 파일의 주소 명시
- method ; 입력받은 데이터를 서버에 전달할 방식을 명시
get ; 주소에 데이터를 추가하여 전달하는 방식, 데이터가 주소 입력창에 그대로 나타남, 데이터 크기 제한적
post ; 데이터를 별도로 첨부하여 전달하는 방식, 데이터가 외부에 드러나지 않고, 데이터 크기 제한 x
2. input
<input type="타입유형" name="이름">
1. text ; 한 줄의 텍스트 입력
2. password ; 한 줄의 비밀번호 입력(별표처리)
3. radio ; 옵션 선택
- name="" 통일해주어야함, value =""; 선택했을 때 제출되는 값, checked ; 기본 선택
4. checkbox ; radio와 같음 but 다중 선택 가능
5. file ; 파일 선택 가능
6. <select></select> ; 여러 리스트 중 선택 가능
- select>option*n ; value="" 선택했을 때 제출되는 값, selected ; 기본 선택
7. <textarea></textarea> ; 여러 줄의 텍스트 입력
- rows ="", cols=""로 열과 행 설정. <textarea></textarea>사이에 글자를 넣어 기본 값 넣을 수 있음
8. <button></button> ; 버튼
- onclick="" ; 눌렀을 때 반응 설정, ex) alert('xxx'), <button></button>사이에 글자 넣을 수 있음
9. submit ; form의 action속성으로 지정된 서버 페이지로 전송
- value="" ; 버튼의 내용
10. <fieldset></fieldset> ; form요소와 관련된 데이터들을 하나로 묶어줌
- <legend> ; fieldset 요소 안에서만 사용 가능하며, fieldset 요소의 제목을 나타냄
input 속성
- value ; 입력필드에 나타나는 초깃값
- readonly ; 입력필드를 볼 수는 있으나, 수정할 수는 없음
- disabled ; 입력필드 사용 불가
- maxlength ; 최대 길이 설정
- size ; 한 번에 보여줄 수 있는 문자 최대 개수 설정
+ 새로 추가된 Input 요소의 type
- number, range, color, date, time, datetime-local, month, week, email, url, tel, search
+ 새로 추가된 Input 요소
- datalist ; 미리 정의된 옵션 리스트 명시
- keygen ; 사용자가 인증할 수 있는 안전한 방법 제공
- output ; 계산 결과 바로바로 표시
+ 새로 추가된 input 속성
- autocomplete ; 저장된 정보를 바탕으로 자동 완성
- novalidate ; 그 정보가 유효한지 아닌지 검사 ex) url, email
- autofocus ; 페이지 로드 시, 자동으로 포커스 가도록 함
- placeholder ; input요소에 입력되어야 할 값에 대한 힌트 제공
- required ; 반드시 입력되어야 할 필수 input요소 명시
'WebProgramming > HTML' 카테고리의 다른 글
[HTML] HTML 작성 가이드라인 & 팁 (0) | 2022.06.02 |
---|---|
[HTML] 전역 속성 (0) | 2022.05.24 |
HTML 글자/단락 태그 + CSS (0) | 2022.05.05 |
HTML 기본 문법 정리 (0) | 2022.04.25 |