radio name value checked input typeradio checked checkbox
� <계속> 기능 속성 사용 예 radio name value checked 이름 선택한 값을 서버에 전달 초기 체크 표시 <input type=“radio” checked> // checkbox name value checked 이름 선택한 값을 서버에 전달 초기 체크 표시 <input type=“checkbox” checked> // button name value 이름 버튼 위에 표기할 문자 <input type=“button” value=“전송”> // submit name value 이름 버튼 위에 표기할 문자 <input type=“submit” value=“쿼리전송”> // reset name value 이름 버튼 위에 표기할 문자 <input type=“reset” value=“원래대로”> // file name value 이름 버튼 위에 표기할 문자 <input type=“file” value=“찾아보기”> // 이름 image name value src 사용할 이미지 파일 설정 <input type=“image” value=“버튼” src=“button. gif”> // name value 이름 초기값 <input type=“hidden” value=“홍길동”> //보이지 않는 형식 hidden
[기본예제 1] 폼 태그 연습 <html><head><title>폼 연습</title></head> <body> <form > <table border=0 align=center cellspacing=1 bgcolor="#dcdcdc"> <tr><td colspan=2 ><img src="title. gif" width=476 border=0></b> </td> </tr> <tr align=center><td colspan=2 ><b>회원 로그인 </b> </td></tr> <tr align=center><td>아이디</td><input type="text" size="15"> </td> </tr> <tr align=center> <td>비밀번호</td><input type="password" size="15"></td> </tr> <tr align=center> <td colspan=2 ><input type="submit" value="전송"> <input type="reset" value="전송"></td> </tr> </table> </form> </body></html> 테이블 설정 셀을 합친 후 이미지 호출 제목과 입력창 설정
[응용예제 2] 폼 태그 연습 <table border=0 align=center cellspacing=1 bgcolor="#dcdcdc"> <tr align=center><td colspan=2>회원 가입 </td></tr> <tr align=center><td colspan=2 ><img src="title. gif"></td></tr> 이미지를 불러옴 <tr><td align=center>아이디</td><input type=text name=id size=12 maxlength=12></td></tr> <tr><td align=center>패스워드</td><input type=password name=pw size=12 maxlength=8></td></tr> <tr><td align=center>성별</td><input type= [ ① ] name=sex value=1>남<input type= [ ① ] name=sex value=2 checked>여</td></tr> <tr><td align=center>국적</td><input type=text value= 대한민국 ><input type=button value=국적변경></td></tr> 패스워드 형식 radio 형식
[기본예제 3] 폼 태그 연습 <html><head><title>폼 연습</title></head> <body ><form > <table border=0 align=center cellspacing=1 bgcolor="#dcdcdc"> <tr align=center><td colspan=2>간단한 프로필 가 입</td></tr> <tr><td align=center>휴대폰</td> <select name=phone 1> <option value=1 SELECTED>011</option> <option value=2>016</option> <option value=3>017</option> <option value=4>018</option> <option value=5>010</option> </select> </tr> <tr><td align=center>자기 소개</td> <td><textarea cols=50 rows=15 name=memo>하고싶은말을 쓰세요. ^^</textarea></td> </tr> <tr><td colspan=2 align=center><input type=submit value=가입> <input type=reset value=재작성></td></tr> </table> </form></body></html> 콤보박스 생성 메일창 생성
� [Input Tag Accessibility Attributes]
[응용예제 4] 폼 태그 연습 <html><head><title>폼 연습</title></head> <body > <form> <table background="bg 5. gif" width="601" cellspacing=0 cellpadding=0 border=0 align=center><td> <table cellspacing=0 cellpadding=5 width="100%" border=1> <tr><td>제목 </td><td colspan=4><input type="text" size=60> </td></tr> <tr><td>아이디</td> <td ><input type="text" size=15> </td> <td>비밀 번호</td><input type="password" size=15> </td> <[ ① ]=5></td></tr><td>주민 번호</td> <input type="text" size=6>-<input type="text" size=7></td> <td>메일 주소 </td><td ><input type="text" size=20></td> </tr> <tr><td>오피스</td> <td > <input type="text" size=3> <input type="text" size=4>
[응용예제 4] 폼 태그 연습 12 <input type="text" size=4></td><td>핸드폰 </td> 13 <td ><select> 14 <option>011<option>010<option>016<option>017<option>019 </select> 15 <input type="text" size=4>-<input type="text" size=4></td></tr> 16 <tr><td>관심 분야</td> 17 <td colspan= [②]><input type="radio">부동산<input type="radio">엔터 테인먼트 18 <[ ③ ] ="radio">재태크<input type="radio">결혼 19 <input type=" [ ④ ] ">학업 및 진로</td></tr> 20 <tr><td>상담 내용</td><td colspan=3> 21 < [ ⑤ ] rows="5" cols="65"></ [ ⑤ ] ></td></tr></table> </td></tr> 22 <tr ><td align=middle> 상담 신청 내용은 신속히 처리하여 통보해 드립니 다. 23 </td></tr></table></form></body></html>
- Slides: 28