Dropdown navbar example

Write code here

J | B | A

<!DOCTYPE html>
<html>
<head>
    <title>Dropdown Navbar</title>
    <style>
        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: green;
        }

li {
            float: left;
        }
            li a, .dropbtn {
                display: inline-block;
                color: white;
                text-align: center;
                padding: 14px 16px;
                text-decoration: none;
            }
                li a:hover, .dropdown:hover .dropbtn {
                    background-color: red;
                }
            li.dropdown {
                display: inline-block;
            }
        .dropdown-content {
            display: none;
            position: absolute;
            background-color:pink;           
        }
            .dropdown-content a {
                color: black;
                padding: 12px 16px;
                text-decoration: none;
                display: block;
                text-align: left;
            }
                .dropdown-content a:hover {
                    background-color: limegreen;
                }
        .dropdown:hover .dropdown-content {
            display: block;
        }
    </style>
</head>
<body>
    <p><i>Dropdown Navbar</i></p>
      <ul>
          <li class="dropdown">
              <a href="home" class="dropbtn">SNITFunda</a>
              <div class="dropdown-content">
                  <a>Techfunda</a>
                  <a>DotNetFunda</a>
                  <a>ITFunda</a>
              </div>
          </li>
        <li class="dropdown">
          <a href="#news">DotNetFunda</a>
        <div class="dropdown-content">
            <a>Articles</a>
            <a>Forums</a>
            <a>Codes</a>
        </div>
        </li>
        <li class="dropdown">
            <a href="#" class="dropbtn">ITFunda</a>
            <div class="dropdown-content">
                <a href="#">Sales</a>
                <a href="#">Offline</a>
                <a href="#">Online</a>
            </div>
        </li>
    </ul>
</body>
</html>

Note: We DO NOT save your trial code in our database.

Dropdown Navbar

Write code here

Output