How to Create HTML Ordered Lists Step By Step Tutorial

How to Create HTML Ordered Lists Step By Step Tutorial

Step by Step Visual Workbook on how to create ordered lists, also called numbered lists, for beginning HTML learners. The focus is on the ol element and builds on the lesson on building unordered bulleted lists that introduced the li element. You get to make a comparison between the ol and ul elements in the follow along demo about How to Change a Light Bulb. A second level bulleted list is added to the number lists. You make use of the web browser developer tools to uncover the styling and layout dynamics of the HTML numbered list elements.

What is Covered?

Uses a very easy to build list and nested list that is quick to create. The following items are covered:

• Understanding the Relationship of the ol and li HTML elements.
• Building single level and multiple level using unordered ul lists.
• Understanding the default padding and bullet positioning.
• Recognizing the default number labels and how they are applied.
• Exploring the CSS list-style-type property.
• View and test with web browser and web browser developer tools

Who Should Take This Tutorial?

This is designed for anyone who is learning about HTML for the first time and wants to get the foundation of how HTML list elements work out of the box. Sets the groundwork for learning the ol number list element.

What Do You Need to Follow this Tutorial?

• Web browser: You can use any web browser.

• Visual Step by Step Workbook: Download

• Follow Along Practice Files: Download