This article is currently in the process of being translated into Vietnamese (~35% done).
The article tag
Thành phần article là một tỏng những thành phần mới trong HTML. Vì là mới nên sẽ có một số nhầm lẫn khi dùng. Nhưng có vẻ khi bạn đánh dấu văn bản dùng <article> thì nó sẽ logic hơn. Có nghĩa là gì? Nó có nghĩa là bạn có thể dùng thành phần <article> khi đánh dấu trang "about me", một blog và mọi bình luận của blog.
Nhưng bạn không phải dùng thành phần <article> quanh mọi đoạn đơn - điểm mấu chốt là, bất kỳ cái gì bạn đưa vào <article> được cho là có ý nghĩa riêng của nó.
Using the Flour-article, the article element should be used like this (please note, that I have replaced a lot of the actual content with three dots, so that the example does not take up too much space):
<!DOCTYPE html>
<body>
<article>
<div id="header">
<h1>All About Flour</h1>
...
</div>
<div id="content">
<h2>The Two Types of Wheat</h2>
<p>There are…</p>
<h2>All-Purpose Flour</h2>
<p>All-purpose …</p>
...
</div>
</article>
</body>
</html>As you can see, the <article> element contains the <div id="header"> and the <div id="content"> as the content in these two <div>’s can be read as a whole article. I have not included the <div id="footer"> as the content in this element has nothing to with the actual article we still use a lot of div-elements in this example, but I will show you in the following chapters which new HTML5 elements you should use instead.
Sometimes you need more than just one example and I’ve included another: Using the blog-entry example from previous chapters, you would use the article element to wrap each blog entry like this:
<article>
<h1>Just Another Day</h1>
<p>Written by Christina<br />
On January 11th </p>
<p class="content">This is my second blog entry, and I just wanted to check in on you </p>
</article>
<article>
<h1>My First Blog Entry</h1>
<p>Written by Christina<br />
On January 10th </p>
<p class="content">I’m so happy to write my first blog entry – yay!</p>
</article>What you have learned
- <article> is a new semantic HTML5 element
- <article> should be used when the content would make sense on its own (e.g. in a rss-reader)
- <article> is a very specific element – more specific than e.g. the <div> element
