html
  1. html-article-tag

HTML <article> Tag

  • The <article> tag in HTML is used to define a self-contained piece of content that could be distributed and reused independently.
  • It is often used for articles, blog posts, forum posts, or any content that can stand alone and make sense on its own.

<article>
  <h2>Article Title</h2>
  <p>Published on <time datetime="2023-11-09">November 9, 2023</time> by John Doe.</p>
  <p>This is the content of the article.</p>
  <p>More paragraphs and details go here...</p>
</article>
Try Playground
  • The <article> tag wraps the entire content of the article.
  • <h2> is used for the article title.
  • <time> is used to represent the publication date. The datetime attribute is used to provide a machine-readable date for better accessibility.

Using the <article> tag helps to semantically indicate that the enclosed content is an independent, self-contained piece of information.

Article Attributes

Here are some common attributes associated with the <article> tag

  1. id

    Specifies a unique identifier for the <article> element. It must be unique within the HTML document.

    <article id="news-article">
    
  2. class

    Specifies one or more class names for the <article> element. This attribute is used to associate the element with a CSS style or multiple styles.

    <article class="blog-post">
    
  3. style

    Allows you to apply inline CSS styles to the <article> element.

    <article style="color: blue;">
    
  4. tabindex

    Specifies the tab order of the <article> element. It is used for navigation when the user interacts with the page using the keyboard.

    <article tabindex="1">
    
  5. hidden

    Indicates that the <article> element should be hidden. This attribute is typically used with JavaScript to show or hide content dynamically.

    <article hidden>
    

These attributes can be used individually or in combination to define the characteristics and behavior of the <article> element.

Published on: