Thẻ HTML <article>

Định nghĩa và cách sử dụng

<article> Thẻ xác định nội dung độc lập và tự bao gồm.

Một bài viết nên có thể hiểu được một cách độc lập và có thể được phân phối riêng biệt so với toàn bộ trang web.

<articel> Nguồn gốc tiềm năng của phần tử bao gồm:

  • Bài viết trên diễn đàn
  • Bài viết blog
  • Tin tức
  • Phản hồi của người dùng

Lưu ý:Trong trình duyệt<article> Các phần tử本身 sẽ không hiển thị bất kỳ樣式 đặc biệt nào. Tuy nhiên, bạn có thể sử dụng CSS để định dạng <article> Các phần tử (xin xem ví dụ dưới đây).

Xin xem thêm:

Tài liệu tham khảo HTML DOM:Đối tượng Article

Mô hình

Ví dụ 1

Ba bài viết độc lập và tự thành phần:

<article>
<h2>Google Chrome</h2>
<p>Google Chrome là trình duyệt web được phát triển bởi Google, được phát hành vào năm 2008. Chrome là trình duyệt web phổ biến nhất trên thế giới hiện nay!</p>
</article>
<article>
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox là trình duyệt web mã nguồn mở được phát triển bởi Mozilla. Từ tháng 1 năm 2018, Firefox đã luôn là trình duyệt web phổ biến thứ hai.</p>
</article>
<article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge là trình duyệt web được phát triển bởi Microsoft, được phát hành vào năm 2015. Microsoft Edge đã thay thế Internet Explorer.</p>
</article>

Thử ngay

Ví dụ 2

Sử dụng CSS để thiết lập樣式 cho phần tử <article>:

<html>
<head>
<style>
.all-browsers {
  margin: 0;
  padding: 5px;
  background-color: lightgray;
}
.all-browsers > h1, .browser {
  margin: 10px;
  padding: 5px;
}
.browser {
  background: white;
}
.browser > h2, p {
  margin: 4px;
  font-size: 90%;
}
</style>
</head>
<body>
<article class="all-browsers">
  <h1>Trình duyệt phổ biến nhất</h1>
  <article class="browser">
    <h2>Google Chrome</h2>
    <p>Google Chrome là trình duyệt web được phát triển bởi Google, được phát hành vào năm 2008. Chrome là trình duyệt web phổ biến nhất trên thế giới hiện nay!</p>
  </article>
  <article class="browser">
    <h2>Mozilla Firefox</h2>
    <p>Mozilla Firefox là trình duyệt web mã nguồn mở được phát triển bởi Mozilla. Từ tháng 1 năm 2018, Firefox đã luôn là trình duyệt web phổ biến thứ hai.</p>
  </article>
  <article class="browser">
    <h2>Microsoft Edge</h2>
    <p>Microsoft Edge là trình duyệt web được phát triển bởi Microsoft, được phát hành vào năm 2015. Microsoft Edge đã thay thế Internet Explorer.</p>
  </article>
</article>
</body>
</html>

Thử ngay

Thuộc tính toàn cục

<article> Nhãn còn hỗ trợ Thuộc tính toàn cục trong HTML.

Thuộc tính sự kiện

<article> Nhãn còn hỗ trợ Thuộc tính sự kiện trong HTML.

CSS thiết lập mặc định

大多数浏览器将使用以下默认值显示 <article> Element:

article {
  display: block;
}

Hỗ trợ trình duyệt

Số trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ phần tử này hoàn toàn.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
6.0 9.0 4.0 5.0 11.1