HTML input 태그

2011. 8. 6. 06:53컴퓨터_computer/PHP, HTML

<input> : 평범하게 글자나 텍스트칸을 넣을 수있는 공간 

1. <input type=""> : input에 type을 지정하여 옵션을 넣으면, 다양한 기능(모양?)을 설정할 수 있습니다.
 
2. <input type="text"> : type에 text를 주어 문자 및 숫자를 입력할 수 있습니다.
2-1. <input type="text" value="유니윌"> : 입력창에 value값인 "유니윌"이 나옵니다.
2-2. <input type="text" value="텍스트 사이즈 지정" size="20"> : 입력창 사이즈를 20만큼 지정
2-3. <input type="text" value="" name="name"> : php나, 자바스크립트를 사용할 때 변수를 넘거나 받을때 name명을 설정하여
     php나, 자바스크립트에서 이 값을 name로 찾습니다.

3. <input type="password"> : type에 password를 주어 문자 및 숫자가 비밀번호 입력창으로 바뀝니다.

4. <input type="checkbox"> : 체크박스로 나타납니다.
4-1. <input type="checkbox" checked> : 처음부터 체크가 선택 되어집니다.
4-2. <input type="checkbox" checked disabled> : 체크된 상태로 변경이 안됩니다.
4-3. <input type="checkbox" disabled> : 체크 선택을 할수 없게 합니다.

5. <input type="radio"> : 라디오 버튼으로 나타납니다.
5-1. <input type="radio" checked> : 처음부터 라디오 버튼의 선택된 것으로 나옵니다.
5-2. <input type="radio" checked disabled> : 선택된 상태로 변경이 안됩니다.
5-3. <input type="radio" disabled> : 선택을 할수 없게 합니다.

6. <input type="hidden"> : 숨김필드입니다. 화면에 나타나지 않습니다. 주로 form태그에서 숨김속성으로 값을 넘길 때 사용합니다.

7. <input type="image" src="이미지 경로 및 주소"> : 일반<img>태그 처럼 할 수 있습니다. 단 버튼이 이미지의 경로로 바뀌고,
   form 태그의 submit 태그와 함께 포함되어 있습니다.

8. <input type="reset"> : 초기화 하는 버튼
8-1. <input type="reset" value="초기화"> :  value값에 따라 버튼 이름을 바꿀수 있습니다.

9. <input type="submit"> : 전송버튼
9-1. <input type="submit" value="확인"> : 전송버튼. 버튼이름 value값을 통해 변경할 수 있다.

10. <input type="file"> : 파일을 첨부할 때 사용하며, CSS와 곁들어서 사용 가능


※ <input> 태그에 CSS를 사용하여 이쁘게 꾸밀 수 있습니다.
<input name="button" style="background-color:#999; border:dashed; font-family:'굴림'; font-size:14px;">

※ <input type="text" value="" maxlength="20"> : maxlength 속성은 최대 글자 입력넣을 수있는 제한수입니다.
   주로 전화번호, 주민등록번호 등 일정한 갯수의 번호를 입력할때 제한을 두죠.