HTML Unordered List

HTML Unordered List | HTML Bulleted List

HTML’s Unordered List or Bulleted List shows items in a list of bullet points. When we don’t need to show the items in a certain order, we can use an unordered list. The HTML ul tag is used for a list that is not in order.

There are four different kinds of bulleted lists:

  • disc
  • circle
  • square
  • none

There are 4 kinds of attributes in the <ul> tag that can be used to show different kinds of ordered lists.

Type “disc”

This is the style most people use. In this style, bullets are used to separate the list items.

Type “circle”

In this style, circles are used to mark the list items.

Type “square”

In this style, squares are used to mark the list items.

Type “none”

The list items are not marked in this style.

HTML Example of an Unordered List

<!DOCTYPE html>
<html>
<body>
<ul>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
<li>Orange</li>
</ul>
</body>
</html>

ul type=”circle” Example

<!DOCTYPE html>
<html>
<body>
<ul type=”circle”>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
<li>Orange</li>
</ul>
</body>
</html>

Output

type circle example

 

ul type=”disc” Example

<!DOCTYPE html>
<html>
<body>
<ul type=”disc”>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
<li>Orange</li>
</ul>
</body>
</html>

Output

type disc example

 

ul type=”square” Example

<!DOCTYPE html>
<html>
<body>
<ul type=”square”>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
<li>Orange</li>
</ul>
</body>
</html>

Output

type square example

 

ul type=”none” Example

<!DOCTYPE html>
<html>
<body>
<ul type=”none”>
<li>Red</li>
<li>Blue</li>
<li>Green</li>
<li>Orange</li>
</ul>
</body>
</html>

Output

type none example

People also search
Scroll to Top