본문 바로가기

webdesign/HTML

폼태그

   
 목록열기    02 JavaScript (25)   
   


   
 form 태그 속성  02 JavaScript  
2009/08/31 11:46

 http://blog.naver.com/kyumi0705/20087803827 


 
◎ 폼 태그 : 사용자로 하여금 어떤 입력을 하도록 하는 폼.

 

1. 폼 태그 
...
속성 값 설명 name 문자열 폼의 이름 action url 폼 양식 태그의 값들이 전송될 url 저장 method post 폼의 전송 방식 - 사용자 아이디 값들이 눈에 보이지 않게 전송 get 폼의 전송 방식 - 노출이 될 수도 있음. action 특성에 지정된 url에 포함되어 전송. enctype MIMETYPE : 을 썼을 때는 "multipart/form-data"를 써야한다.(?) 2. 폼 양식 태그 1) 한 줄 입력 텍스트 상자 속성 값 설명 type text 한줄 입력 상자. 컨트롤에 이름을 부여한다. name 문자열 입력 상자의 이름 value 문자열 아이디 창안에 '아이디를 입력하시오'등 미리 입력될 문자 지정. 컨트롤의 초기값. size 숫자 한줄 텍스트 입력 상자의 너비. 보이는 칸의 수 maxlength 숫자 한줄 입력 상자의 글자 최대 길이 (한글 10글자 = 영문 10글자, byte가 아닌 글자수로 제한) tabindex 숫자 탭키를 이용해 컨트롤의 포커스를 옮길 때, 그 순서를 정한다. readonly 컨트롤이 읽기 전용이 되어 value값을 수정할 수 없다. disabled 입력 상자를 비활성화시킨다. 사용자 입력을 못하도록 한다. disabled 컨트롤은 tabindex를 갖지 않는다. tabindex 포커스 순서를 지정. autocomplete off 자동완성기능해제. style border:0; - 외곽선 속성을 0으로 셋팅 width:50; - 가로 넓이 height:50; - 세로 길이 background-color:#FF0099; - 배경색 속성 color:#FF0099; - 글자색 속성 background-image:url;(이미지 경로/이미지 파일명) - 텍스트 상자안에 이미지 삽입 background-position:0px 0px; - 이미지 표시 위치 text-align:center; - 텍스트 정렬(center / right / left) ime-mode:active; - default 한글 입력 inactive; - default 영문 입력 auto; - 한글/영문 중 선택된 mode disabled; - 영문만 입력 text-transform:uppercase - 대문자로 변환. lowercase - 소문자로 변환. capitalize - 첫문자만 대문자로 변환. font-family:돋움; - 폰트 종류 font-size:12px; - 폰트 사이즈 border-style:solid; border-bottom:#B5B6B5 1px solid; border-left:#B5B6B5 1px solid; border-right:#B5B6B5 1px solid; border-top:#B5B6B5 1px solid; padding-right:3px; padding-top:2px; 2) 여러줄 입력 텍스트 상자 속성 값 설명 name 문자열 입력 상자 이름 cols 숫자 입력 상자 너비 rows 숫자 입력 상자 높이 disabled tabindex readonly 3) 비밀번호 입력 상자 입력글자 / 숫자를 비밀번호로 간주하여 **** 으로 가려줌 4) 보이지 않는 입력 상자 숨김필드 (해당 필드값을 보이지 않고 넘길 때 사용) 5) 선택을 위한 라디오 버튼 - 한가지만 선택 가능 성별 : 여자 남자 6) 선택을 위한 체크박스 - 다중 선택 가능 취미 : 컴퓨터 영화 음악 속성 값 설명 type checkbox input 태그의 공통적인 속성으로 type에 의해 컴포넌트가 바뀐다. 여기에선 checkbox이기 때문에 CheckBox 컴포넌트가 되는 것이다. name 문자열 모든 input 태그에 존재하는 식별자. jsp나 php 기타 웹언어에서 넘겨받을 값의 변수명이기도 하다. value 문자열 이 컴포넌트에 체크했을 때, 넘겨지는 값이다. checked 이 속성이 존재하면 체크되어 있고, 없으면 체크되어 있지 않게 된다. 7) 목록 태그(리스트 박스, 콤보 박스) 시작과 종료 태그로 이루어지며, option들은 OPTGROUP으로 묶을 수 있다. 속성 name 문자열 컨트롤에 이름을 부여한다. size 숫자 한 번에 보이는 메뉴의 갯수 multiple Ctrl이나 Shift 키를 눌러 두 개 이상의 메뉴를 선택할 수 있다. OPTGROUP : label = 문자열 - 옵션 그룹에 대한 이름표. selected 8) 전송버튼 9) 확인버튼 10) 취소버튼 초기화 버튼 (버튼에 이름 未표시) 11) button을 image로 보이기. 이미지경로에 있는 이미지로 대체되어 submit 기능을 하게 함. 12) 파일첨부 버튼 태그저장 취소 이 포스트를.. 덧글 1개 엮인글 쓰기 공감 ‘02 JavaScript’ 카테고리의 다른 글 checkbox에 관한 2010.01.29 input 항목의 null을 한방에 체크. 2010.01.27 replace(arg1, arg2) - 문자 치환 함수 2009.11.13 radiobutton에 관한... 2009.11.11 a & img 태그 2009.10.22 1 2 3 4 5 글 보내기 서비스 안내 2009년 6월 30일 네이버 여행 서비스가 종료되었습니다. 네이버 여행 서비스를 이용해 주신 여러분께 감사드리며, 더 좋은 서비스로 보답할 수 있도록 노력하겠습니다. 문서파일로 저장하기 파일로 저장하기 버튼을 누른 후 잠시만 기다려주세요. 이 기능은 베타 서비스 중입니다. 변환 후 배경음악등 일부 내용은 정상적으로 표시되지 않을 수 있습니다. 문서파일로 저장하기 메뉴 도움말 카메라 모델 해상도 노출시간 노출보정 프로그램모드 ISO감도 조리개값 초점길이 측광모드 촬영일시