HTML에서 사용되는 input type 종류 및 활용방법

1. input type = "radio"

<input type="radio" name="food" value="라면" checked>라면 <input type="radio" name="food" value="떡볶이">떡볶이 <input type="radio" name="food" value="피자">피자 <input type="radio" name="food" value="치킨">치킨

 

 

2. input type = "text" , input type = "password" 

이름 : <input type="text" name="my_name" size="10"> 비밀번호 : <input type="password" name="my_password" size="15"> <input type="text" name="my_name" size="20" value="수정안됨" readonly>

 

 

3. select option 

<table> <tr> <td colspan="2"> <h2>가장 웃긴것을 선택해주세요.</h2> </td> </tr> <tr> <td valgn="top"> <select name="items1"> <option value="HTML">HTML</option> <option value="자바스크립트">자바스크립트</option> <option value="CSS">CSS</option> </select> </td> </tr> <tr> <td valign="top"> <select name="items2" size="3"> <option value="HTML">HTML</option> <option value="자바스크립트">자바스크립트</option> <option value="CSS">CSS</option> </select> </td> </tr> </table>

 

 

4. input type = "checkbox" 

<input type="checkbox" name="computer" value="CPU" checked>CPU <input type="checkbox" name="computer" value="Memory">Memory <input type="checkbox" name="computer" value="HDD">하드디스크 <input type="checkbox" name="computer" value="CDROM">CDROM <input type="checkbox" name="computer" value="GRAPIC_CARD">GRAPIC_CARD

 

 

5. input type ="button" ,input type = "submit", input type = "reset" 

<input type="button" value="로그인화면"> <input type="submit" value="회원 가입"> <input type="reset" value="다시 입력">

 

 

6. input type ="file" 

filename :<input type="file" name="fileName">

 

 

7. input type ="image" 

이미지:<input type="image" src="abs.gif">