HTML Unordered List
📌 Key Takeaways
- HTML Unordered List
- HTML Unordered List | HTML Bulleted 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
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
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
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
