html 회원 가입 예제 코드 / form action / select / input
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74 |
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>form 태그</title>
</head>
<body>
<!-- 사용자의 데이터를 입력 받아서 , 특정 작업을 할 때 사용 -->
<!-- <form action="받은 데이터를 처리할 페이지의 경로(특정 작업을 하는 위치)"
method="get|post" 생략하면 get방식></form>
get 방식 : 정보를 헤더에 담아서 보낸다
주소표시줄에 정보가 보인다
보안에 취약하다
적은 양의 데이터 처리
속도가 빠르다
post 방식 : 정보를 바디에 담아서 보낸다
주소 표시줄에 정보가 안보인다
보안에 덜 취약하다
많은 양의 데이터 처리
속도가 상대적으로 느리다
name=자바 스크립트나 css에서 호출할때 사용할 이름
enctype=file upload 할 때 사용한다>
form elements : <input type> , <select> , <textarea> , <button> , <datalist>
</form>
-->
<form action = "ex15.html" method="get">
<fieldset style="width:300px">
<legend>Form 요소</legend>
<p>이름 : <input type="text" name="name" placeholder="이름 입력"/></p>
<p>나이 : <input type="number" name="age" placeholder="나이 입력"/></p>
<p>전화 : <input type="tel" name="tel" placeholder="전화번호 입력"/></p>
<p>비밀번호 : <input type="password" name="pwd" placeholder="비밀번호"/></p>
<p>파일 : <input type="file"/></p>
<p>컬러 : <input type="color"/></p>
<p>날짜 : <input type="date"/></p>
<p>시간 : <input type="time"/></p>
<p>날짜시간 : <input type="datetime"/></p>
<p>범위 : <input type="range"/></p>
<!-- 라디오 버튼 : 여러개 중 하나만 선택 가능 -->
<p>성별 : <input type="radio" name="gender" value="남"/>남자
<input type="radio" name="gender" value="여"/>여자
</p>
<!--체크 박스 : 여러개 중 여러개 선택 가능-->
<p>취미 : <input type="checkbox" name="hobby" value="축구"/>축구
<input type="checkbox" name="hobby" value="야구"/>야구
<input type="checkbox" name="hobby" value="배구"/>배구
<input type="checkbox" name="hobby" value="농구"/>농구
</p>
<p>거주지 : <select name="addr">
<option>선택하세요</option>
<option value="서울">서울</option>
<option value="대전">대전</option>
<option value="대구">대구</option>
<option value="부산">부산</option>
<option value="광주">광주</option>
</select>
</p>
<p>자기소개</p>
<p><textarea rows="20" cols="50"></textarea>
</p>
<p><input type="submit" value="정보전달"/><input type="reset" value="정보취소"/></p>
<p><input type="button" value="정보 보내기" onclick="자바스크립트함수"/></p>
<p><button onclick="자바스크립트함수"/>회원 가입</button></p>
</fieldset>
</form>
</body>
</html> |
cs |
html코드로 게시판 회원 가입 양식을 작성해봤습니다.
jswoo030@gmail.com으로 질문을 보내시면 빠른 답변을 받으실 수 있습니다.
'HTML│CSS│Java Script' 카테고리의 다른 글
| 자바 스크립트 배열 (0) | 2017.12.05 |
|---|---|
| 자바스크립트 (0) | 2017.12.04 |
| html table / div / iframe 태그 작성하는 방법 (0) | 2017.12.04 |
| html ul 태그 li 태그 (0) | 2017.12.01 |
| margin padding (0) | 2017.12.01 |
댓글