How To Make an HTML List

In web design, there are 3 different types of lists which you may wish to add to your site.

Ordered List

The first is an <ol>: This is an ordered list of contents. For example:

  1. An item
  2. Another item
  3. Another goes here.

Inside the <ol> tag we list each item on the list inside <li> </li> tags.

For example:

<ol>
<li>An item </li>
<li>Another item </li>
<li>Another goes here </li>
</ol>
Unordered List

The second type of list that you may wish to include is an <ul> unordered list. This is better known as a bullet point list and contains no numbers.

An example of this is:

<ul>
<li>This is </li>
<li>An Unordered </li>
<li>List </li>
</ul>
Definition List

Finally, you may wish to include a definition list <dl> on your page. An example of a <dl> list is as follows:HTMLHypertext markup language is a programming language used to create web pages and is rendered by a web browser.

The code used for the above is as follows:

<dl>
<dt>Item</dt>
<dd>The definition goes here</dd>
</dl>

Let’s try it out. Open index.html and on a new line, enter the following HTML:

<p>This website will have the following benefits for my business:</p>
<ul>
<li>Increased traffic </li>
<li>Global Reach</li>
<li>Promotional Opportunities</li>
</ul>

Now hit save and check out the results in your browser. If everything worked out then it will display a bullet-pointed table displaying the information above.

Related Posts

Beginner’s Guide to Sass

Have you ever wondered what SASS stands for? Or perhaps you already know what it is but haven’t taken the time to study and use it. Whether…

Responsive Web Design – Modern Website Code for Beginners

When the internet was still young, website visitors used desktop and then laptop computers with wide screens to access websites. Then when smart phones were developed, mobile…

Beginner’s Guide to React

React is a JavaScript library that aims to simplify the development of visual interfaces. Developed at Facebook and released to the world in 2013, it drives some…

Server-Side Rendering (SSR) Made Easy With Angular Universal 9+

The Angular team recently, announced a pre-render builder in Angular Universal, in Jan 2020 to be specific. Angular Universal is for server-side rending (SSR); with these new…

Why Should I Use HTML5?

The most straight-forward answer to that question is simply that it is the current, “right” version of the language. But some people seem unconvinced by this fact….

What is HTML5?

HTML5 is the latest specification of the HTML language, and represented a major break with previous markup practices. The purpose of the profound changes to the language was…