웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
input태그 type의 종류..
2003.01.21 00:16
안녕하세욤^^*
input태그 type의종류를 조금알려드릴까하구욤..
혹시모를 한사람을위해..
레드님의 강좌를 읽다가 그냥 한번 적어보는겁니다 생각나는데로욤
절대 테클 강의는 아닙니다 오해마시길..
허접강의지만 그냥한번 올려볼게욤^^
<input type="hidden" name="form1"> //숨김 타입입니다
<input type="text" name="form1" size="20" maxlength="15" style="background-color:purple;border-color:red;"> //일반 텍스트 표현방식 폼입니다
<input type="password" name="form1" size="20" maxlength="15" style="background-color:purple;border-color:red;"> //별표로 표현됩니다
<input type="button" value="일반버튼" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //일반 버튼입니다
<input type="reset" value="취소" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //취소버튼입니다
<input type="submit" value="전송" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //전송 버튼입니다
<input type="radio" name="radio1"> //라디오 버튼입니다
<input type="checkbox" name="checkbox1"> //체크박스 입니다
<input type="file"> //파일을 올릴때 씁니다
<input type="image" src="m1.gif"> //이미지를 보여줄때 씁니다
설명이 많이 부족하겠지만 조금할께욤 ^_^
input 는 말그대로 입력이란 뜻입니다 input type 이란건 입력할때 종류란 거겠죠?
그종류는 제가아는정도는 위에 설명 // 한데로 입니다
name 은 폼(입력방식)의 이름입니다
size 는 그폼의 크기이며 maxlength 는 내가 입력할 최대한의수를 말합니다
style 은 모양새를 말합니다 그종류로는
background-color 바탕색
border-color 선의색
font-face 혹은 font-family 폰트의 이름입니다
font-size 폰트의 크기이며 픽셀단위입니다
등등등이 있습니다....
급하게적느라 많이 부족한것같습니다 제가 잘못올리거나 부족한게있다면 리플 바랍니다
감기조심하세욤 ^_^*
input태그 type의종류를 조금알려드릴까하구욤..
혹시모를 한사람을위해..
레드님의 강좌를 읽다가 그냥 한번 적어보는겁니다 생각나는데로욤
절대 테클 강의는 아닙니다 오해마시길..
허접강의지만 그냥한번 올려볼게욤^^
<input type="hidden" name="form1"> //숨김 타입입니다
<input type="text" name="form1" size="20" maxlength="15" style="background-color:purple;border-color:red;"> //일반 텍스트 표현방식 폼입니다
<input type="password" name="form1" size="20" maxlength="15" style="background-color:purple;border-color:red;"> //별표로 표현됩니다
<input type="button" value="일반버튼" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //일반 버튼입니다
<input type="reset" value="취소" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //취소버튼입니다
<input type="submit" value="전송" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;"> //전송 버튼입니다
<input type="radio" name="radio1"> //라디오 버튼입니다
<input type="checkbox" name="checkbox1"> //체크박스 입니다
<input type="file"> //파일을 올릴때 씁니다
<input type="image" src="m1.gif"> //이미지를 보여줄때 씁니다
설명이 많이 부족하겠지만 조금할께욤 ^_^
input 는 말그대로 입력이란 뜻입니다 input type 이란건 입력할때 종류란 거겠죠?
그종류는 제가아는정도는 위에 설명 // 한데로 입니다
name 은 폼(입력방식)의 이름입니다
size 는 그폼의 크기이며 maxlength 는 내가 입력할 최대한의수를 말합니다
style 은 모양새를 말합니다 그종류로는
background-color 바탕색
border-color 선의색
font-face 혹은 font-family 폰트의 이름입니다
font-size 폰트의 크기이며 픽셀단위입니다
등등등이 있습니다....
급하게적느라 많이 부족한것같습니다 제가 잘못올리거나 부족한게있다면 리플 바랍니다
감기조심하세욤 ^_^*
댓글 14
-
뒹굴리스트
2003.01.21 00:20
-
뒹굴리스트
2003.01.21 00:21
또한가지;;;
hidden 속성에서 스타일이 필요할까요;ㅁ;
말 그대로 숨기는 것인데요;ㅁ; -
&zeo
2003.01.21 00:33
제목;; inpurt라고;; -
날수없는하늘
2003.01.21 00:35
뒹굴리스트 // 압;;; 글쿤욤..
&zeo // 고칠게욤 ^^;; -
GPel
2003.01.21 10:45
value 속성도 추가해주세요~^^ -
날수없는하늘
2003.01.21 19:21
GPel // value 속성은 버튼방식에선 버튼에 나타날 문자..즉 버튼의 이름(값)이 됩니다
텍스트 폼상자에 적용이될경우 맨처음 보여지는 문자를 나타내죠
예) <input type="text" name="form1" value="ID를 입력하세요" size="20" maxlength="15" style="background-color:purple;border-color:red;">
이런경우 폼필드안에 "ID를 입력하세요" 란 문자가 맨처음 보여지는것이죠! 물론 지울수도 있습니다
이런경우 회원가입란에 홈페리지를 입력하는칸에 많이스이죠..
예) value="http://www." 이렇게욤^_^a -
ZipShin
2003.01.22 15:03
[특강] input 태그에 대한 정리
- SiteLink #1 : http://www.tagmania.net/html/tagnote.html
이건 제가 쓴글이 중복이라고 생각하지만, 아랫분이 input태그에 대해서 정리를 해놨었는데;;^^
제가 다시 알려드리죠..^^
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와 곁들어서 사용 가능
# 기타
1. <input type="text" value="텍스트"> : 이렇게 사용하면 텍스트 칸에 텍스트 라고 글자가 이미 나와버림
2. <input type="text" value="텍스트 사이즈 지정" size="20"> : 텍스트 사이즈를 20만큼 지정
3. <input type="text" value="" name="text"> : php이나, 자바스크립트를 사용할때 변수를 넘거나 받을때 text라는 값을 받도록 name의 갑을 text라 지정하고 이 버튼의 태그 이름을 text라고 지정함
4. <input type="text" value="" name="text" style="border:1;color;red"> : 이건 CSS인데 여러모로 사용 할수있음. 굳이 설명을 하지 않겠음 CSS에서 color;red 라고 지정해주면, 텍스트칸의 글자색을 빨간색으로 지정해줌
# 기타2
특히 value는 <input>태그의 텍스트의 이름을 부여 할때 사용함
예를 들면, <input>과 <input value="텍스트칸 이에요"> 와 차이점을 알게 될 것임
각버튼마다 name값을 부여 할 수있음(name값은 자기마음대로 지정가능)
예를 들면) <input name="button">
각버튼마다, type를 지정할수 있다. 위의 설명을 보면 알겠죠?
type="text/password/hidden/radio/checkbox/file/submit/reset/image"
# 기타3
버튼에 CSS를 첨가하여 이쁘게 꾸밀 수있다.
<input name="button" style="background-color:purple;border-color:red;font-face:굴림;font-size:9pt;">
↑위의 처럼
@ 기타4
어이구~~ 이거빠졌는뎅..~
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자리만 입력가능
< 강좌 끝 > -
N/A
2003.01.28 15:29
이거 너무 어렵게 설명하신듯 공통속성은 따로 설명하는것이 더 쉽게 들어올걸요
readonly속성 빠졌군요 이것은 읽기전용인데 자바스크립트 등을 이용하여 고칠 수는 있지만 직접 수정할 수는 없습니다 -
GPel
2003.01.28 17:02
value... 알려달라는 것이 아니라.. 위에 적어 두셨으면~ 한거였는데-_-; -
GPel
2003.01.28 17:07
N/A // disabled도 비슷한 기능을 하죠..
하지만 readonly과는 다르게 탭키로 포커스 이동시 문자열이 선택되지 않는 점이 다르죠..
그리고 음.. 윈도우에서 항목을 입력할 수 없게 해둔것 처럼 바탕이 회색으로 나오죠..
(xp에서는 테마 때문인지 잘 분간이 안가네요;;) -
ZipShin
2003.01.28 19:09
아참, readonly속성 빠졌군요..^^ -
BIRDY™
2003.02.01 13:09
accesskey : 단축키(alt+문자)
tabindex=숫자 : 포커스순서
autocomplete=off : 자동완성기능해제 -
조은하루
2003.02.04 20:40
readonly는 폼으로 넘겼을시 값이 반영이 되구
disabled는 값이 반영되지 않는 차이가 있습니다. 참고하시길.. -
ZipShin
2003.02.10 14:30
BIRDY™//BIRDY™님 그런것도 있었는줄 알았는데, 사용을 잘안하니.. 잊어먹어서..^^
제목 | 글쓴이 | 날짜 |
---|---|---|
스크롤바 뒤집을때 문서 전체가 뒤집히는것 방지할때 [4] | K.샘 | 2003.02.01 |
* 특정한 이미지 파일의 투명도 조절하기 [5] | 장윤호 | 2003.01.28 |
핫키를 타겟에 적용시켜 봅시다-_- [3] | 위드 | 2003.01.21 |
input태그 type의 종류.. [14] | 날수없는하늘 | 2003.01.21 |
스크롤바 자동/예/아니오 [11] | 레드 | 2003.01.18 |
테이블 테그시 <td>옵션을 쉽게 작성/변경해 봅시다 [2] | 위대한위선자 | 2003.01.18 |
[레드의 태그중급]폼 태그..(이상해져서 삭제하구 다시 적습니다) [3] | 레드 | 2003.01.15 |
[HTML 초보자]동영상을 출력하자-8(Object) [1] | ZipShin | 2003.01.14 |
[레드의 태그초보]링크태그 [5] | 레드 | 2003.01.14 |
[레드의 태그초보]이미지삽입 태그 [2] | 레드 | 2003.01.14 |
[레드의 태그초보]아이프레임을 새롭게 구조하였습니다..(;;) [3] | 레드 | 2003.01.14 |
모바일(핸드폰용) 홈페이지 만들기. [8] | 고광욱 | 2003.01.13 |
테이블을 이용한 문서의 정렬 [4] | 서성원 | 2003.01.11 |
이미지 없이 그라데이션 효과 내기 - 수정. [7] | Pe-i | 2003.01.10 |
[1분짜리 팁!] 스크롤바 왼쪽으로 위치하게 하기! [6] | 찐군 | 2003.01.09 |
[1분짜리 팁!] 테이블 테두리 얇게 하기 [5] | 찐군 | 2003.01.09 |
[1분짜리 팁!] 마우스커서 바꾸기! [10] | 찐군 | 2003.01.09 |
기본에 충실하자. 표관련 태그 정리... [2] | 이기형 | 2003.01.09 |
글씨태그 | 조현원 | 2003.01.08 |
다중 테이블?? [7] | hooniv | 2003.01.03 |
submit 속성을 내포하고 있죠;