●폼 양식 태그
<form></form>
모든 폼 양식 태그는 반드시 <form>태그 안에 위치해야 한다.
특성/특성값/설명
action/ URL/ 폼 양식 태그의 값들이 전송될 URL지정
method/
post/ 폼 양식 태그의 값들이 눈에 보이지 않게 전송
get/ 기본값, 폼 양식 태그의 값들이 action특성에 지정된 URL에 포함되어 전송
target/ 문자열/ Action특성에 지정된 URL이 보여질 프레임 이 름을 지정
●한줄 입력
<input>
ex) <input type="text" name="my_age" size="37">
특성/특성값/설명
type/ Tex/ type=“text” 지정
name/ 문자열/ 폼 양식 태그 이름
size/ 숫자/ 입력 상자의 너비 지정
value/ 문자열/ 입력상자에 미리 입력될 문장 지정
maxlength/ 숫자/ 입력할수 있는 글자의 최대 길이 지정
●<textarea></textarea>
여러 줄 텍스트를 입력할 수 있는 입력상자
ex)<textarea name="my_m" cols="60" rows="5"></textarea>
특성/특성값/설명
cols/ 숫자/ 입력 상자의 너비 지정
rows/ 숫자/ 높이 지정
name/ 문자열/ 이름 지정
●라디오버튼&체크박스
ex)라디오버튼
<input type="radio" name="cpu" value="코어2듀오" checked>코어2듀오</input>
<input type="radio" name="cpu" value="코어2듀오" checked>코어2듀오
=>차이없음
ex)체크박스
<input type="checkbox" name="interating" value="여행" checked>여행
특성/특성값/설명
Type/ Radio/ type = “radio” 지정 (체크박스의 경우 type=checkbox)
Name/ 문자열/ 라디오 버튼 이름
Value/ 문자열/ 라이오 버튼이 가지는 값
checked/ 없음/ 버튼이 선택된 상태로 됨
라디오버튼&체크박스는 무조건 name으로 지정
=>하나의 이름이 여러개를 접근 할 수 있기 때문에 id가 아니라 name으로 묶어야 한다.
●전송버튼,입력최소 버튼
<input>태그를 사용하여 만들며, type특성에 따라 서로 다른 버튼이 된다.
ex)
<div align="center"> <input type="submit" value="회원 가입"> <input type="reset" value="다시 입력"> </div>
특성/특성값/설명
type/ submit/ 전송 버튼 reset/ 입력/ 취소 버튼 value/ 문자열/ 버튼에 나타날 글자 지
●dropdownlist
태그/특성/특성값/설명
<SELECT>/
name/ 드랍다운 리스트 이름 지정
size/ 드랍다운리스트가 기본적으로 보여줄 목록 개수 이 특성 생략하면 드롭다운 리스트가 되며 지정하면 리스트 상자가 된다.
multiple/ 리스트 상자에만 적용 리스트 상자에서 여러 개의 목록을 선택할수 있다.
<OPTION> value 값 지정
|
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
|
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>Insert title here</title>
</head>
<body>
<table>
<tr>
<td colspan="2">
<H3>가장 재미있는 것을 선택해 주세요</H3>
</td>
<tr>
<tr>
<td valign="top"><select name="items1">
<option value="HTML">HTML</option>
<option value="js">js</option>
<option value="CSS">CSS</option>
</select></td>
<td valign="top"><select name="items2" size="3">
<option value="HTML">HTML</option>
<option value="js">js</option>
<option value="CSS">CSS</option>
</select></td>
</tr>
<input type ="submit" value="전송하기">
<input type ="reset" value="다시입력">
</table>
</body>
</html>
|
cs |