[HTML] Semantic 태그, form 태그

• Semantic Tag
  • 시맨틱 태그는 포함된 컨텐츠의 특정 의미를 정의하고 목적을 갖는 태그
  • block element이면서 레이아웃을 설계하기 위해 존재
  • 시맨틱 태그의 요소
    • <header>
    • <nav>
    • <article>
      • 뉴스 기사나 블로그 같은 독립된 contents 표시
    • <section>
      • 문서 영역 구성, H1~H6와 함께 사용
    • <footer>
    • <main> 등

 

• form 태그
  • form 태그 안에 input 태그를 두어서 사용자로부터 정보를 입력받아 서버로 보내는 역할을 담당
  • form 태그가 안 맞거나 없으면 서버로 정보를 보낼 수 없음
  • 중첩적으로 사용 불가, 하나의 웹페이지에 하나의 form 태그를 두는 것이 일반적
  • get 방식 전송 name속성1=값1&name속성2=값2&name속성3=값3 의 형태
  • 속성 값
    • 각 태그 식별: id, name, class
    • name 속성: input, textarea, select
    • id랑 class 속성: table, div, p, h …
• form 태그의 주요 속성
  • action
    • 정보 전송 시 처리할 서버페이지 url 지정 (php, jsp, asp)
  • method
    • 정보를 서버로 보낼 때 보내는 방법 지정 (get, post)
  • enctype
    • 파일을 보낼 때 이 속성을 채워서 보내야함
  • name
    • 폼 객체 접근 (document.폼이름)
  • id
    • document.getElementById(”아이디”)