Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to make simple dropdown menu using CSS

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 305
    Comment on it

    Hello Reader's if you are new to designing the menu bar, Then you can see how to make the quick dropdown menu using HTML and CSS.

    <!DOCTYPE html>
    <html>
    <title>findnerd dropdown example</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://www.w3schools.com/lib/w3.css">
    <body class="w3-container">
    <h2>Dropdown Menu</h2>
    <p>Hover over "Link A" to open the dropdown menu.</p>
    <div class="w3-topnav w3-orange">
      <div class="w3-dropdown-hover">
        <a href="#">Link A</a>
        <div class="w3-dropdown-content w3-card-4">
          <a href="#">Link 1</a>
          <a href="#">Link 2</a>
          <a href="#">Link 3</a>
        </div>
      </div>
      <a href="#">Link B</a>
      <a href="#">Link C</a>
    </div>
    </body>
    </html>
    

    And you see the output of above code here W3.CSS

    Dropdown Menu

    Hover over "Link A" to open the dropdown menu.

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: