Article element

HTML Fundamentals Course: Building the Web

Sobre a Aula

Hello, students! In this lesson, we will learn about the article element.

Structural elements are HTML elements that provide information about the meaning of the content they contain.

The article element is a top-level structural element used to represent an independent content item.

Topics

What is the article element?
How to use the article element?
Code examples

What is the `article` element?

The article element is a top-level structural element used to represent an independent content item.

An independent content item is a piece of content that can be consumed on its own.

For example, a newspaper article, a blog post, or a web page about a product are all examples of independent content items.

How to use the `article` element?

To use the article element, simply wrap it around the content you want to represent as an independent content item.

Here is an example of code to use the article element:

<article>
  <h2>This is an article</h2>
  <p>This is the content of the article.</p>
</article>

This code will create an article element with a title and a paragraph.

Code examples

Here are some code examples to use the article element:

<article>
  <h2>Newspaper Article</h2>
  <h3>News Title</h3>
  <p>This is the content of the news.</p>
</article>

<article>
  <h2>Blog Post</h2>
  <h3>Post Title</h3>
  <p>This is the content of the post.</p>
</article>

<article>
  <h2>Web Page About a Product</h2>
  <h3>Product Information</h3>
  <p>This is the content about the product.</p>
</article>

These codes will create article elements with titles, paragraphs, and other relevant content elements.

Exercises

Create a web page with an article element representing a newspaper article.
Include the news title, content, and other relevant content elements in the article.
Save the document and open it in a browser.

Observe how the browser displays the page.

Good luck!