<tr><th colspan="3">이름,지역,나이</th></tr>
- colspan : 세개의 열 하나로 묶음
<tr><td rowspan="2">luster1031</td><td>사랑시고백구행복동</td><td>50</td></tr>
<tr><td>핵복동</td><td>90</td></tr>
- rowspan : 행 묶음
- th, td는 그냥 굵게
form 태그
http://localhost:8080/edu/htmlexam/exam2.html?
stname=luster1031&
stpwd=1234&
stage=11111&
stcolor=%23064110&
stfood=f1&stfood=f3&stfood=f4&
gender=female
- 전송하기 누르면 이렇게 나옴
- 웹 서버에게 뭔가를 요청하면서 함께 전달하는 name = value형식의 문자열
- Query String (GET)
- Request Parameter (POST) 라고 함
https://search.naver.com/search.naver?where=nexearch&sm=top_hty&fbm=0&ie=utf8&query=Java
- naver.com에 java라고 입력시 나타나는 주소
- GET방식
- query 정보 외부에 공개
- 간단함
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h1>입력폼 학습</h1>
<hr>
<form>
이름 <input type="text" name="stname" required>
<br> 암호 <input type="password" name="stpwd">
<br> 나이 <input type="number" name="stage"><br>
<!-- HTML5 -->
좋아하는 칼라 <input type="color" name="stcolor"><br>
<!-- HTML5 -->
좋아하는 음식
<br> 햄버거 <input type="checkbox" name="stfood" value="f1">
비지찌게 <input type="checkbox" name="stfood" value="f2">
회덮밥 <input type="checkbox" name="stfood" value="f3">
돈까스 <input type="checkbox" name="stfood" value="f4">
<br> 성별 <br>
남성 <input type="radio" name="gender" value="male">
여성 <input type="radio" name="gender" value="female"><br>
<input type="submit" value="전송하기">
<input type="reset" value="초기상태로">
</form>
</body>
</html>
- name속성이 없으면, server한테 전달 X
- name value쌍으로 전달하기 때문
- name속성은 유니크 해야한다.
- checkbox는 이름이 다 똑같아야 한다.
- value속성을 써서, name value가 전달하도록해야한다.
- value안 쓰면 뭔가 선택된지 모른다.
- submit (기본 내장 핸들러가 내장되어 있음)
- 모든 내용을 쿼리문자로 바꿔서 서버에 전달
- value : 버튼의 라벨
- 꼭 있어야 함
- reset
- 처음 랜더링 한 상태로 바꿔줌
- placeholder : 희미하게 보여줌
- 힌트 문자열 표현해줌
- 입력하면 자동으로 사라짐
<li><label for=phone>연락처</label>
<input id=phone name=phone type=tel
placeholder="00*-000*-0000" pattern="[0-9]{2,3}-[0-9]{3,4}-[0-9]{4}"></li>
- pattern, placholder사용
<li>
<label for=date_of_birth>생일</label>
<input id=date_of_birth name=date_of_birth type=date min="1950-01-01" max="2000-01-01">
</li>
- max : 2000.01.01 이후에는 안 나옴
- min : 1950.01.01
<li>
<label for=gender>성별</label>
<input id=gender name=gender type=text list=gender_list>
<datalist id=gender_list>
<option value=male label=남>
<option value=female label=여>
</datalist></li>
- 입력상자인데
- 많이입력되는 항목 먼저 리스트에 보여줌
- testarea
- 큰 입력상자 사용자에게 제공
- 여러 행 입력할 수 있게 해줌
- select
- mutipul : 체크박스와 비슷 (여러개 선택 가능)
- file
- 개행
- 개행 여러개 줘도 블랭크 하나로 인식하게 된다.
- html에서 개행을 br 태그로 함
- 싱글 사이드 태그 : 닫는게 없음
- <p>
- 하나의 단락으로 묶을 수 있음
- 중간에 빈 행도 적당하게 들어감 (조금 줄 간의 간격 뛰어줌)
'study > JAVA 전문가' 카테고리의 다른 글
[servlet] 상태정보 유지 기술 (0) | 2021.12.29 |
---|---|
[Servlet] Get방식 (0) | 2021.12.28 |
[Servlet & JSP] 1 (0) | 2021.12.27 |
[tomcat] 실습 - html, servelt (0) | 2021.12.27 |
[Web programming] (0) | 2021.12.27 |