Learn how do you make a list that lists its items with squares?

Posted on: February 11, 2021 by Deven

In this sort code example, you will learn how do you make a list that lists its items with squares. In order to create a list that lists its items with squares we use list-style-type CSS property.

ul{
list-style-type: square;
}

Consider the example below Fruitslist.html:

<!DOCTYPE html>
<html>
   <head>
      <title>Fruits List</title>
   </head>
   <body>
      <h1>Fruits</h1>
      <p>The list of Fruits :</p>
      <ul style="list-style-type:square">
         <li>Mango</li>
         <li>Grapes</li>
         <li>Apple</li>
      </ul>
   </body>
</html>

You will get the following output in the browser: