How To Create a Hoverable Dropdown Menu

<!doctype html>


<style>
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}

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: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}
</style>



<ul>
  <li><a href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
  <li class="dropdown">
    <a href="#" class="dropbtn">Dropdown</a>
    <div class="dropdown-content">
      <a href="#">Link 1</a>
      <a href="#">Link 2</a>
      <a href="#">Link 3</a>
    </div>
  </li>
</ul>

<h3>Dropdown Menu inside a Navigation Bar</h3>
<p>Hover over the "Dropdown" link to see the dropdown menu.</p>


</!doctype>How To Create a Hoverable Dropdown Menu

Post a Comment

0 Comments

Update Posts

স্মার্ট নাগরিক গঠনে গ্রন্থাগারের ভুমিকা রচনা ১০০০ শব্দ
তালিবানি মুখোশ খুলে ঝাঁঝরা হয়েছিলেন সুস্মিতা বন্দ্যোপাধ্যায় লাভ জেহাদীর, মাধ্যমে ধর্মান্তরিত হয়ে নির্যাতিত হয়েছে ধর্ষিত হয়েছে মারা গেছে এরকম দশটি কাহিনী
Disclaimer
১০টি বাংলাদেশের সেরা ক্যান্সার হাসপাতাল  10 best cancer hospitals in Ban...
১০ বছরে মাধ্যমিক, ১৬-তে ইঞ্জিনিয়ার, ক্যাটও পাশ করে ফেলল এই কিশোরী!
Top 14 Best Paying CPC/PPC Ad Networks
100% Proof - How to Get Back Suspended YouTube Channel Bangla - 100% Solution
Keyboard shortcuts for Windows
ইবনে সিনা হাসপাতালের ডাক্তার লিস্ট | Ibn Sina Hospital Dhanmondi Doctor ...
Goutom buddho biography গৌতম বুদ্ধের জীবনী গৌতম বুদ্ধের জীবনের বিস্ময়কর অজানা তথ্য  ইতিহাস জেনে নিন