[HTML5] HTML5 기초 : input 유형과 속성

HTML5에서 사용되는 input 유형입니다.'ㅁ')/ 아래 내용은 파일 첨부하였으니 최신 브라우저에서 확인해 보실 분들은 확인해 보세요. 아마도 후회할 것임ㅋㅋㅋ

1. text
   - 텍스트를 입력함
2. password
   - 비밀번호 입력시 사용하며 동그리마로 표기됨
3. checkbox
   - 여러개를 체크할 수 있음
4. radio
   - 한가지만 선택
5. file
   - 파일을 업로드 할 수 있음
6. submit
   - 폼에 입력한 값을 전송함
7. New) email
   - 지원하는 곳에서 자판이 email용으로 변하고 email형식을 입력해야함
8. New) url
   - 지원하는 곳에서 자판이 url용으로 변하고 http://가 자동으로 앞에 사용됩니다.
9. New) number
   - 상하버튼을 눌러서 숫자를 변경 할 수 있습니다.
   • min : 최소값
   • max : 최대값
   • step : 숫자 간격 (기본값은 1)
   • value : 초기값
10. New) range
    - 슬라이드 막대로 숫자를 변경
    • min : 최소값
    • max : 최대값
    • step : 숫자 간격 (기본값은 1)
    • value : 초기값(생략하면 슬라이드 가운데)
11. New) date...
    - 날짜와 관련된 유형입니다.
    •  date : 연도, 월, 날짜를 선택
    •  month : 연도, 월 선택
    •  week : 연도, 주 선택
    •  time : 시간을 표시
    •  datetime : 날짜, 시간 선택. UTC 시간대 기준
    •  datetime-local : 연도, 월, 날짜 현지 시간이 표시됨
12. New)search
    - 검색상자입니다. 입력시 상자 오른쪽에 x 표시가 됩니다.
13. New)color
    - 색상을 선택합니다.

추가된 유형들은 대부분이 현재 브라우저에서 미미하게 지원을 하고 있기 때문에 바로 사용하기에는 큰! 무리수가 있더군요.'ㅡ'); 적용되면 아무튼 편하긴 할듯. 새로 추가된 속성들은 그냥 적도록 하겠습니다.

---

autocomplete

- 검색 사이트에서 많이 활용되는 자동 완성 기능 속성입니다.

따로 속성값을 지정하지 않으면 on입니다. 

autofocus

- 페이지 로딩이 끝난후 자동으로 포커스가 가있도록 하는 속성입니다.

datalist

- 텍스트 박스에 미리 입력가능한 내용들을 적어 놓을 수 있습니다. 셀렉트 박스와 비슷 하다고 생각하시면 될듯.

ex)

<input type="text" />

<datalist>

<option>하코사</option>

<option>강소이</option>

<option>Astral PS</option>

</datalist>

placeholder

- 텍스트 박스에 미리 텍스트를 넣어 놓고 클릭하면 사라지게 해주는 속성입니다. 부디 빨리 적용되길 ㅋㅋㅋ

required

- 폼을 전송하기 위해서 꼭 입력해야 하는 내용을 지정하는 속성입니다.

formaction, formmethod, formenctype, formnovalidate, formtarget

- 폼을 컨드롤 할 수 있게 해주는 속성들인데 제가 아직 이해를 제대로 못해서 일단 패스 하겠습니다.__)a;