Tanda <article> HTML

Definisi dan penggunaan

<article> Tag ini menentukan konten yang berdiri sendiri dan berisi.

Sebuah artikel seharusnya dapat dipahami secara mandiri dan dapat disebarkan secara mandiri dari situs keseluruhan.

<articel> Sumber potensial elemen termasuk:

  • Topik forum
  • Artikel blog
  • Berita
  • Komentar pengguna

Perhatian:Dalam pelayar web,<article> Elemen itu sendiri tidak menampilkan gaya khusus apapun. Tetapi, Anda dapat menggunakan gaya CSS untuk <article> Elemen (lihat contoh di bawah).

Lihat juga:

Panduan Referensi DOM HTML:Objek Artikel

Contoh

Contoh 1

Tiga artikel berisi yang berdiri sendiri dan berisi:

<article>
<h2>Google Chrome</h2>
<p>Google Chrome adalah pelayar web yang diembangkan oleh Google dan diterbitkan pada tahun 2008. Chrome adalah pelayar web yang paling populer di dunia saat ini!</p>
</article>
<article>
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox ialah pelayar web sumber terbuka yang diembangkan oleh Mozilla. Dari bulan Januari 2018, Firefox selalu menjadi pelayar web yang paling populer kedua.</p>
</article>
<article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge 是微软开发的一款网络浏览器，于 2015 年发布。Microsoft Edge 取代了 Internet Explorer。</p>
</article>

亲自试一试

Contoh 2

Gunakan CSS untuk menetapkan gaya elemen <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>Browsa yang Paling Populer</h1>
  <article class="browser">
    <h2>Google Chrome</h2>
    <p>Google Chrome adalah pelayar web yang diembangkan oleh Google dan diterbitkan pada tahun 2008. Chrome adalah pelayar web yang paling populer di dunia saat ini!</p>
  </article>
  <article class="browser">
    <h2>Mozilla Firefox</h2>
    <p>Mozilla Firefox ialah pelayar web sumber terbuka yang diembangkan oleh Mozilla. Dari bulan Januari 2018, Firefox selalu menjadi pelayar web yang paling populer kedua.</p>
  </article>
  <article class="browser">
    <h2>Microsoft Edge</h2>
    <p>Microsoft Edge 是微软开发的一款网络浏览器，于 2015 年发布。Microsoft Edge 取代了 Internet Explorer。</p>
  </article>
</article>
</body>
</html>

亲自试一试

全局属性

<article> 标签还支持 HTML 中的全局属性。

事件属性

<article> 标签还支持 HTML 中的事件属性。

默认的 CSS 设置

大多数浏览器将使用以下默认值显示 <article> 元素：

article {
  display: block;
}

浏览器支持

表中的数字注明了首个完全支持该元素的浏览器版本。

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