Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Learn Challenge: Structuring Content with Lists | HTML Fundamentals
HTML Essentials

book
Challenge: Structuring Content with Lists

Task

Create an HTML document that presents your favorite movies using both unordered and ordered lists.

html

index.html

copy
<!DOCTYPE html>
<html>
<head>
<title>Favorite Movies</title>
<meta charset="UTF-8" />
</head>
<body>
<!-- Step 1: Create an unordered list -->
<h2>Favorite Action Movies</h2>
<_____>
<_____>[Movie 1]</_____>
<li>[Movie 2]</li>
<_____>[Movie 3]</_____>
</_____>

<!-- Step 2: Create an ordered list -->
<h2>Top 3 Comedy Movies</h2>
<_____>
<_____>[Movie 1]</_____>
<li>[Movie 2]</li>
<li>[Movie 3]</li>
</_____>
</body>
</html>

Hint

  • Step 1: Use <ul> tag to create an unordered list of favorite action movies. Add <li> tags for each movie.
  • Step 2: Use <ol> tag to create an ordered list of top comedy movies. Add <li> tags for each movie.
html

index.html

copy
<!DOCTYPE html>
<html>
<head>
<title>Favorite Movies</title>
<meta charset="UTF-8" />
</head>
<body>
<!-- Step 1: Create an unordered list -->
<h2>Favorite Action Movies</h2>
<ul>
<li>Mad Max: Fury Road</li>
<li>The Matrix</li>
<li>The Dark Knight</li>
</ul>

<!-- Step 2: Create an ordered list -->
<h2>Top 3 Comedy Movies</h2>
<ol>
<li>Groundhog Day</li>
<li>Superbad</li>
<li>The Grand Budapest Hotel</li>
</ol>
</body>
</html>

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 2. Chapter 8
some-alt