웹마당넷 |input tag에 대한 정리!

HTML5

제 목

input tag에 대한 정리!

작성자

웹돌이

등록일

2007-10-09 20:01:51

조회수

4,894

소스와 설명	미리보기
1. <input> : 평범하게 글자이나 텍스트칸을 넣을 수있는 공간이 생기죠.
2. <input type=""> : 기존의 input에다가 type를 지정하여 type의 옵션을 넣으면, 다양한 모양이 됩니다. 단 입력이나 기타등등의 모양 꼴로 변하죠.
3. <input type="text"> : 이건 <input>과 동일한 것인데, text를 넣을 수있습니다.
3-1 <input type="password">: 이건 1번과 2번과 3번과 동일한데, 비밀번호로 지정되어 글자를 넣든 숫자를 넣든 **** <-이렇게 표시됩니다
4. <input type="checkbox"> : 이건 체크박스로 나타납니다.
5. <input type="checkbox" checked> : 이건 체크박스의 선택된 것으로 나오죠.
6. <input type="checkbox" checked disabled> : 이건 체크되었다가 다시는 선택 못하게 하는거죠
7. <input type="radio"> : 이건 라디오 버튼으로 나타납니다.
8. <input type="radio" checked> : 이건 라디오 버튼의 선택된 것으로 나오죠.
9. <input type="radio" checked disabled> : 이건 선택되었다가 다시는 선택 못하게 하는거죠
10. <input type="hidden"> : 이건 숨김필드입니다. 값을 넘겨받을때 숨김속성으로 몰래 감쳐지죠. 대부분 form태그의 중요한 속성을 사용할 때 하더군요.
11. <input type="image" src="이미지 경로및 주소"> 이건 이미지의 경로를 넣어 일반<img>태그 처럼 할 수 있습니다. 단 버튼이 이미지의 경로로 바뀌고,form 태그의 submit태그와 함께 포함되어 있습니다.
12. <input type="reset"> : 이건 초기화 하는 버튼(영어로 submit 또는 초기화라고 나옴)
13. <input type="reset" value="초기화"> : value값에 초기화라고하면 초기화라고 만들어줌
14. <input type="submit"> : 이건 전송버튼
15. <input type="submit" value="전송함"> : 전송버튼인데다가 버튼이름을 전송함 이라고 할 수있음.
16. <input type="file"> : 파일을 첨부 할때 사용하며, CSS와 곁들어서 사용 가능
17. <input type="text" value="텍스트"> : 이렇게 사용하면 텍스트 칸에 텍스트 라고 글자가 이미 나와버림
18. <input type="text" value="텍스트 사이즈 지정" size="20"> : 텍스트 사이즈를 20만큼 지정
19. <input type="text" value="" name="text"> : php이나, 자바스크립트를 사용할때 변수를 넘거나 받을때 text라는 값을 받도록 name의 갑을 text라 지정하고 이 버튼의 태그 이름을 text라고 지정함
20. <input type="text" value="" name="text" style="border-color:red;"> : 이건 CSS인데 여러모로 사용 할수있음. 굳이 설명을 하지 않겠음 CSS에서 color;red 라고 지정해주면, 텍스트칸의 글자색을 빨간색으로 지정해줌
21. 버튼에 CSS를 첨가하여 이쁘게 꾸밀 수있다. <input name="button" style="background-color:yellow;border-color:red;font-face:굴림;font-size:9pt;">
disabled의 속성과 maxlength="15"의 속성 disabled속성은 input의 선택을 못하게 막아준다 <input type="text" value="" disabled> <input type="text" value="ㅋㅋㅋ 금지욧" disabled> <input type="radio" value="" checked disabled> <input type="checkbox" value="" checked disabled> 그리고 maxlength 속성은 최대 글자 입력넣을 수있는 제한수입니다. <input type="text" value="" maxlength="20"> <--이렇게 하면 글자 입력수를 20자리만 입력가능

글자제한과 폰트사이즈 지정 font-size:7pt;
인푸트폼의 넓이와 높이를 지정 width:150pt; height:12pt;
글자제한과 폰트사이즈와 백그라운드이미지 지정 background-image:url("test.gif");