How to Make Double Bullets HTML in few minutes

How To Make Double Bullets HTML

Last Updated: October 21, 2024By

How To Make Double Bullets HTML

We should know about lists to create double bullets using HTML, especially unordered ones.

Unordered Lists:

As the name suggests, the unordered lists in HTML are used to create a list of items on a web page in an unordered fashion, meaning there isn’t any specific sequence in those items and they can be taken into account in any order. For that, the bullets are used to indicate each item in the list. For example we create an unordered list of Oceans around the world which doesn’t require any order.

Let the order look like this:

  • Indian Ocean
  • Atlantic Ocean
  • Pacific Ocean
  • Arctic Ocean

We code it as below:

<!DOCTYPE html>
<html lang=”en”>
<head>
    <meta charset=”UTF-8″>
    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
    <title>Document</title>
</head>
<body>
    <ul>
      <li>Indian Ocean</li>
      <li>Atlantic Ocean</li>
      <li>Pacific Ocean</li>
      <li>Arctic Ocean</li>
    </ul>
</body>
</html>
In the same way we can create double bullets using nested unordered lists.
For example we create lists of mobile brands with their models:
  • iPhone
    • iPhone  16
    • iPhone 16 Pro Max
  • Samsung
    • Samsung s23 ultra
    • Samsung  Galaxy

For this type of lists we can make use of double bullets using unordered lists as follows:

<!DOCTYPE html>
<html lang=”en”>
<head>
    <meta charset=”UTF-8″>
    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
    <title>Document</title>
</head>
<body>
    <ul>
        <li>iPhone
          <ul>
            <li>iPhone 16</li>
            <li>iPhone 16 Pro Max</li>
          </ul>
        </li>
        <li>Samsung
          <ul>
            <li>Samsung s23 ultra</li>
            <li>Samsung Galaxy</li>
          </ul>
        </li>
      </ul>
     
     
</body>
</html>
This code implements a unordered list within an unordered list to make double bullets of the example used.

editor's pick

latest video

news via inbox

Nulla turp dis cursus. Integer liberos  euismod pretium faucibua

Leave A Comment

you might also like