HTML5 - New Structural Tags : <article>
HTML5 - New Structural Tags ( 구조 태그 ) : <article></article>
01. <section></section>
02. <article></article>
03. <aside></aside>
04. <header></header>
05. <hgroup></hgroup>
06. <footer></footer>
07. <nav></nav>
02. <article></article>
article의 사전상 의미가 신문이나 잡지에서 기사를 뜻하는 것처럼 article태그 역시 웹상의 실제 내용을 말한다. 보통 블로그의 포스트나 웹사이트의 내용, 사용자가 등록한 코멘트, 독립적인 웹콘텐츠 항목이 모두 여기에 해당한다.
<section>과 <article>태그를 사용하는데 있어 자주 혼동하곤 하는데, 독립적으로 배포하거나 재사용하더라도 완전히 하나의 콘텐츠가 된다면 article태그를 쓰면 된다.
article태그에 비해 section태그는 콘텐츠 기준이라기 보다 헤더와 섹션, 푸터와 구분하기 위한 기능상의 구분이다. 즉, section태그를 이용해 콘텐츠 영역을 구분해 놓고, article태그를 이용해 내용을 채워나간다고 생각하면 된다.
source )
<!DOCTYPE html>
<html>
<body>
<article>
<h1>Code is Poetry.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
<p><strong>Note:</strong> The article tag is not supported in Internet Explorer 8 and earlier versions.</p>
</body>
</html>
result )
Code is Poetry.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Note: The article tag is not supported in Internet Explorer 8 and earlier versions.
'Web Design > HTML & HTML 5' 카테고리의 다른 글
| HTML5 - New Structural Tags : <hgroup> (0) | 2018.04.28 |
|---|---|
| HTML5 - New Structural Tags : <aside> (0) | 2018.04.28 |
| HTML5 - New Structural Tags : <section> (0) | 2018.04.26 |
| HTML - META tag (0) | 2018.04.26 |
| HTML vs HTML5 (0) | 2018.04.25 |
