HTML Unordered List - Learn php Online Free

Table of Contents:

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$

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$

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$

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$