HTML Lists are utilized to determine arrangements of data. All rundowns or lists might contain at least one rundown or list component. There are three unique kinds of HTML lists
  1. <ul>- unordered or bulleted lists.
  2. <ol>-ordered or numbered list.
  3. <dl>- definition or description list.
HTML- Unordered or Bulleted list
you can use an unordered or bulleted list if your list doesn't require a specific sequence or order. The <ul> tag is used to list items in an unordered or bulleted list. you have four options to use an unordered list.

  1. disc: The list items are marked as bullate and it is the default value of unordered lists.
  2. circle: In this option, the list items are marked as circles.
  3. square: The list items are marked as square.
  4. none: The list items are not marked.
Example: unordered list with the type disk

<!DOCTYPE html>  
<html>  
<body> 
<ul type="disk">  
 <li>Youtube</li>  
 <li>Facebook</li>  
 <li>Twitter</li>  
</ul>  
</body>  
</html>  
Output


Example: unordered list with the type circle
<!DOCTYPE html>  
<html>  
<body>
<ul type="circle">  
  <li>Youtube</li>  
 <li>Facebook</li>  
<li>Twitter</li> </ul> </body> </html>

Output


Example: unordered list with the type square
<!DOCTYPE html>  
<html>  
<body>
<ul type="square">  
  <li>Youtube</li>  
 <li>Facebook</li>  
<li>Twitter</li> </ul> </body> </html>
Output


Example: unordered list with the type square
<!DOCTYPE html>  
<html>  
<body>
<ul type="none">  
  <li>Youtube</li>  
 <li>Facebook</li>  
<li>Twitter</li> </ul> </body> </html>

Output



Nested Unordered Lists
If you want to include an additional list of items inside an item you can use nested lists.
Example: Nested List with the same type "Square".
<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
<ul type="square" >
	<li>Youtube
<ul type="square">
	<li>Brand Account</li>
	<li>Personal Account</li>
</ul>
	</li>
	<li>Facebook</li>
	<li>Twitter</li>
</ul>
</body>
</html>

Output



Example: Nested List with the different type.
<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
<ul type="square" >
	<li>Youtube
<ul type="circle">
	<li>Brand Account</li>
	<li>Personal Account</li>
</ul>
	</li>
	<li>Facebook</li>
	<li>Twitter</li>
</ul>
</body>
</html>
Output

Watch on You Tube