1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <!DOCTYPE html> <html> <body> <form action ="input.jsp" method = "post"> 이메일 : <input type ="email" name ="email" /><br/> URL : <input type="url" name="url" /><br/> 전화번호 : <input type="tel" name = "tel" /> <br/> 색상 : <input type ="color" name ="color" /> <br/> 월 : <input type ="month" name ="month" /> <br/> 날짜 : <input type= "date" name ="date" /> <br/> 주 : <input type="week" name ="week" /> <br/> 시간 : <input type="time" name="time" /> <br> 지역 시간 : <input type="datetime-local" name="localdatetime" /> <br/> 숫자 : <input type ="number" name="number" min="1" max ="10" step ="2"/><br/> 범위 : <input type ="range" name="range" min="1" max="10" step="2"/> <br/> 제출 : <input type="submit" value ="제출"/> </form> </body> </html> | cs |
★★★*<input> 태그의 유형들
텍스트 필드 & 패스워드 필드 : type = "text" , type ="password"
텍스트 필드 : 사용자가 한 줄짜리 텍스트를 입력하는 요소
패스워드 필드 : 특성이 같음
*유형
name : 텍스트필드 / 패스워드 필드 이름
size : 텍스트 필드의 길이
value : 처음 화면에 표시되는 텍스트.
maxlength : 사용자가 입력할 수 잇는 최대 문자 개수
*type 속성
text : 텍스트입력
password : 비밀번호 입력
radio : 라디오버튼
checkbox : 체크박스
file : 파일첨부버튼
reset : 초기화
submit : 입력내용을 서버로 넘기고 form 태그의 action에서 지정한 프로그램 실행
image : submit버튼 대신 이미지 삽입
search : 검색창에 입력하면 오른쪽에 x가 표시. x를 클릭하면 필드내용 삭제
email/url/tel
ranges : 슬라이드막대를 이용한 숫자 입력방법(min , max , step(숫자간격), value(기본값지정)
date/datetime : 연도/월/날짜 표시 // 시간까지 표시
*end태그 전에 적으면 적용될 속성들
required : 필수 입력 필드 체크 / hidden X , image,button,submit,reset X
placeholder : 필드 안에 적당한 힌트내용을 표시하고있다가 클릭하면 내용이 사라진다
'JAVA > HTML, CSS' 카테고리의 다른 글
| Web - CSS(boxmodel & 레이아웃) (4) | 2018.07.02 |
|---|---|
| Web - CSS(selector) (0) | 2018.07.02 |
| Web - <div> 태그 (0) | 2018.06.28 |
| Web - list (0) | 2018.06.27 |
| Web - html 개념 (0) | 2018.06.27 |