Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

html

What is the <article> element in HTML?

Talha Ashar

Grokking Modern System Design Interview for Engineers & Managers

Ace your System Design Interview and take your career to the next level. Learn to handle the design of applications like Netflix, Quora, Facebook, Uber, and many more in a 45-min interview. Learn the RESHADED framework for architecting web-scale applications by determining requirements, constraints, and assumptions before diving into a step-by-step design process.

The <article> element in HTML represents self-contained content that is distributable independently from the rest of the site. Examples of content that you can include within the <article> element include forum posts, blog entries, user-submitted comments, or any other independent item of content.

There is no limit to the number of <article> elements a single document can contain. Similar to most HTML elements, the <article> element can be styled using CSS.

Attributes and events

The <article> element includes only global attributes and supports all the usual events supported by HTML elements.

Usage

Generally, an <article> element should be identified by a heading. You can do this by including one of the heading tags (<h1>-<h6>) as a child of the <article> element, as shown below:

<article>
    <h1>This is the first article. 
</article>

<article>
    <h2>This is the second article. 
</article>

Example

The code below shows how the <article> element works in HTML:

Explanation

The code above utilizes 33 <article> elements, where each element represents a particular ceramic. As shown in the example above, each <article> element contains content that is exclusive to itself and does not depend on any other part of the document.

Since the content contained within each <article> element is independent of the rest of the document, each <article> element can be freely distributed. This distribution may involve the content of the <article> elements cited on a different site or appearing in search engine queries.

Note: For further details regarding the <article> element, you can check the documentation.

RELATED TAGS

html

CONTRIBUTOR

Talha Ashar
Copyright ©2022 Educative, Inc. All rights reserved

Grokking Modern System Design Interview for Engineers & Managers

Ace your System Design Interview and take your career to the next level. Learn to handle the design of applications like Netflix, Quora, Facebook, Uber, and many more in a 45-min interview. Learn the RESHADED framework for architecting web-scale applications by determining requirements, constraints, and assumptions before diving into a step-by-step design process.

Keep Exploring