04 폼 관련 태그들

04-1 폼 만들기

  • 웹에서 자주 만나는 폼
  • <form> 태그 - 폼 만들기
  • <label> 태그 - 폼 요소에 레이블 붙이기
  • <fieldset>, <legend> 태그 - 폼 요소 그룹으로 묶기

04-2 사용자 입력을 위한 <input> 태그

  • <input> 태그 살펴보기
  • <input> 태그 - 입력 항목 만들기
  • type="hidden" - 히든 필드 만들기
  • type="text" - 텍스트 필드 만들기
  • type="password" - 비밀번호 입력란 만들기
  • type="search", type="url", type="email", type="tel" - 분화된 텍스트 필드
  • type="number" - 숫자 입력하기
  • type="range" - 슬라이드 막대로 숫자 지정하기
  • type="radio", type="checkbox" - 라디어 버튼과 체크박스 넣기
  • type="color" - 색상 선택 상자 표시하기
  • type="date", type="month", type="week" - 날짜 표시하기
  • type="time", type="datetime", type="datetime-local" - 시간 지정하기
  • type="submit", type="reset" - 서버 전송, 리셋 버튼 넣기
  • type="image" - 이미지 버튼 넣기
  • type="button" - 버튼 넣기
  • type="file" - 파일 첨부하기

04-3 <input> 태그의 다양한 속성

  • autofocus 속성 - 입력 커서 표시하기
  • placeholder 속성 - 힌트 표시하기
  • readonly 속성 - 읽기 전용 필드 만들기
  • required 속성 - 필수 필드 지정하기
  • min, max, step 속성
  • size, minlength, maxlength 속성 - 길이, 최소 길이, 최대 길이 속성

04-4 여러 데이터 나열해 보여 주기

  • <select>, <optgroup>, <option> 태그 - 드롭다운 목록 만들기
  • <datalist> 태그, <option> 태그
  • <textarea> 태그 - 여러 줄 입력하는 텍스트 영역 만들기

04-5 기타 다양한 폼 요소들

  • <button> 태그 - 버튼 넣기
  • <output> 태그 - 계산 결과
  • <progress> 태그 - 진행 상태 보여주기
  • <meter> 태그 - 값이 차지하는 크기 표시하기

results matching ""

    No results matching ""