HTML5에서 추가된 것들

HTML5에서 추가된 것들

1. header: 사이트 제목, 또는 본문 헤더.

<header> 요소는 일반적으로 다음을 포함합니다.

  • 하나 이상의 제목 요소 (<h1> - <h6>)

  • 로고 또는 아이콘

  • 저자 정보‌

하나의 문서에 여러 개의 요소를 포함 할 수 있습니다. 참고 : 태그는 , 또는 다른 요소 내에 배치 할 수 없습니다.

<article>
  <header>
    <h1>Most important heading here</h1>
    <h3>Less important heading here</h3>
    <p>Some additional information here</p>
  </header>
  <p>Lorem Ipsum dolor set amet....</p>
</article>

태그는 문서 또는 섹션의 바닥 글을 정의합니다. 요소는 포함 요소에 대한 정보를 포함해야합니다. 요소는 일반적으로 다음을 포함합니다.

  • 저자 정보

  • 저작권 정보

  • 연락처 정보

  • 사이트 맵

  • 위로 가기 링크

  • 관련된 문서

하나의 문서에 여러 개의 요소를 포함 할 수 있습니다.

<footer>
  <p>Posted by: Hege Refsnes</p>
  <p>Contact information: <a href="mailto:someone@example.com">
  someone@example.com</a>.</p>
</footer>

3. section: 하나의 주제로 구성된 콘텐츠 또는 애플리케이션 블럭

하나의 주제와 관련있는 콘텐츠의 블럭

<section>
  <h1>WWF</h1>
  <p>The World Wide Fund for Nature (WWF) is....</p>
</section>

4. article: 본문 콘텐츠로서 주변과 분리해도 하나의 완전한 콘텐츠가 되는 영역

태그는 독립적 인 독립 컨텐츠를 지정합니다. 기사는 독자적으로 이해해야하며 나머지 사이트와 독립적으로 기사를 배포 할 수 있어야합니다. 주로 사용 되는 예 :

  • 포럼 게시물

  • 블로그 게시물

  • 뉴스 기사

  • 논평

<article>
  <h1>Google Chrome</h1>
  <p>Google Chrome is a free, open-source web browser developed by Google, released in 2008.</p>
</article>

5. nav: 내비게이션 링크 그룹

nav 태그는 일련의 탐색 링크를 정의합니다. 문서의 모든 링크가 요소 내에 있어야하는 것은 아닙니다. 요소는 탐색 링크의 주요 블록에만 사용 됩니다 .사용 중지 된 사용자를위한 화면 판독기와 같은 브라우저는이 요소를 사용하여이 콘텐츠의 초기 렌더링을 생략할지 여부를 결정할 수 있습니다.

<nav>
  <a href="/html/">HTML</a> |
  <a href="/css/">CSS</a> |
  <a href="/js/">JavaScript</a> |
  <a href="/jquery/">jQuery</a>
</nav>

6.aside: 주요한 내용이 아닌 부가적인 콘텐츠

태그는 배치 된 내용을 제외하고 일부 내용을 정의합니다. 별도의 콘텐츠는 주변 콘텐츠와 관련되어야합니다.

<p>My family and I visited The Epcot center this summer.</p>
<aside>
  <h4>Epcot Center</h4>
  <p>The Epcot Center is a theme park in Disney World, Florida.</p>
</aside>

Last updated