<!DOCTYPE html>
<head>
<meta charset="UTF-8" >
<title> Title of Web</title >
</head>
<body>
<h1> Inquiry form</h1 >
<form action="contact.php" method="post" enctype="multipart/form-data" >
<!-- action은 해당 form에서 유저가 입력한 데이터를 어디로 보낼지 지정해주는 것 -->
<p> name : <input type="text" name="name" size="20" maxlength="10"
value="kim"></ p>
<p> password : <input type="password" name="password" size="20"
maxlength= "10" value ="12345"></ p>
<!-- size 는 표시상의 사이즈 -->
<!-- max length 는 입력할 때 최대 글자수 지정 -->
<!-- value 는 초기값으로 처음부터 어떠한 글자를 표시하기 위해 사용 -->
<p> cellphone :
<label>< input type ="checkbox" name="mobile" value="1" checked>
iPhone </label>
<label>< input type ="checkbox" name="mobile" value="2">
android </label >
<input type="checkbox" name="mobile" value="3" > and so on
</p>
<!-- 복수의 항목을 선택할 수 있기 하기 위해서는 check box -->
<!-- checked 는 초기값으로 표시될 때 선택되어 있는 상태로 표시된다. -->
<p> sex :
<label>< input type ="radio" name="sex" value="1" checked>
male</label >
<label>< input type ="radio" name="sex" value="2" >
female</ label>
</p>
<!-- 항목을 하나만 선택할 수 있기 하기 위해서는 radio -->
<!-- label은 check box 나 radio 에서 체크하는 버튼 옆의 글자
( Iphone, Android , male, female)를 클릭해도 버튼이 체크 되게 하는 역할. -->
<p> language :
<select name="language" size="2" multiple>
<option value="ko" selected> Korean </option>
<option value="jp" > Japanese </ option>
<option value="en" > English </ option>
<option value="ch" > chinese </option>
<option value="fr" > french </option>
</select>
</p>
<!-- select는 풀다운 메뉴를 의미한다.
속성으로 multiple은 중복선택을 가능하게 한다. -->
<!-- selected 는 초기값 -->
<P> picture : <input type="file" name="picture"></ P>
<!-- 파일 업로더 폼은 file이라는 타입을 이용한다. -->
<!-- 파일 업로더를 이용하기 위해서는 form 태그에
enctype="multipart/form-data"를 입력해야 함 -->
<input type="hidden" name="user_id" value="12348" >
<!-- 유저에게는 알릴 필요 없으므로 화면에는 표시할 필요가 없지만
프로그램 처리 상 필요한 정보를 전송할 때는 hidden사용 -->
<p> memo : <textarea name="memo" rows="5" cols="40">
initialize memo </textarea></ p>
<p>< input type ="submit" name="submit" > </ p>
</form>
<p>< input type ="button" value="normal_button" ></p>
</body>
</html>
|
<결과 화면>
 |
No comments:
Post a Comment