1. 입력요소
1-1. input
사용자로부터 값을 입력받을 수 있는 대화형 컨트롤(필드),
기본적으로 인라인 요소이며, 단일태그이다.
name 식별자를 추가하면 각 입력항목을 이름별로 구분할 수 있다.
<input type="text" name="입력하는곳 1번지">
type 값에 따라 입력 요소나 형태가 달라진다.
주로 사용하는 type은 button,checkbox,date 등등
주가적인 type정보는 https://developer.mozilla.org/ko/docs/Web/HTML/Element/Input
<input>: 입력 요소 - HTML: Hypertext Markup Language | MDN
HTML <input> 요소는 웹 기반 양식에서 사용자의 데이터를 받을 수 있는 대화형 컨트롤을 생성합니다. 사용자 에이전트에 따라서 다양한 종류의 입력 데이터 유형과 컨트롤 위젯이 존재합니다. 입
developer.mozilla.org
1-2. select
다수의 옵션을 포함할 수 있는 선택메뉴이다.
안쪽에 옵션을 줄 수있다.
한눈에 다 보이는 multiple 속성도 추가가능하다
1-3. textarea
여러 줄의 일반 텍스트를 입력할 수 있는 입력요소이다.
input과 마찬가지로 name을 추가할 수 있다.
rows="10" cols="10" 등의 요소를 추가해서 칸 수를 조정할 수 있다.
2. form
사용자의 입력요소를 받아서 데이터를 서버로 전송해준다.
2-1. 내용 제출
사용자가 입력한 데이터를 서버로 보내기 위해 사용하는 태그이다.
form의 내용(입력값)을 제출하기 위해서, input 태그의 sub 타입도 사용가능하다.
2-2. 속성
action : 입력값을 전송할 서버의 url
method : 클라이언트가 입력한 데이터를 어떤 식으로 전송할지 (GET , POST)
2-3. GET 과 POST
GET
: 서버에 요청을 보내서 응답을 받아낸다.
즉, 가져오는 성격의 요청
POST
: 서버에 요청을 보내어 작업을 수행한다. 추가/수정/삭제 한 후에 응답을 받아낸다.
즉, 서버 정보를 조작한다.
'Knowledge > HTML & CSS' 카테고리의 다른 글
[CSS-4] float, clear (0) | 2023.05.30 |
---|---|
[CSS-3] 박스모델 (Box-model) (0) | 2023.05.30 |
[HTML-4] 메타 태그, 뷰포트 (0) | 2023.05.30 |
[HTML-2] 속성 링크 목록 (0) | 2023.05.30 |
[HTML-1] 기본 태그 (0) | 2023.05.30 |