×

Html & Html5

The World's best Software Development Study Portal

Bootstrap Dropdown


Here in Bootstrap we can create the dropdown button by which user have to choose anyone from the list. And we use .dropdown class for it.

Let’s understand this by the following program:-

<!DOCTYPE html>

<html lang="en">

<head>

<title> bootstrap 5 Example</title>

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>

</head>

<body>

<div class="container-fluid">

<h2>Dropdown Button</h2>

<div class="dropdown">

<button type="button" class="btn btn-primary dropdown-toggle" data-bs-toggle="dropdown"> Fruits </button>

<div class="dropdown-menu">

<a class="dropdown-item" href="#">Apple</a>

<a class="dropdown-item" href="#">Banana</a>

<a class="dropdown-item" href="#">Litchi</a>

</div>

</div>

</body>

</html>

Output of this Program


bootstrap 5 Example

Dropdown Button


So here we get our dropdown menu.






Bootstrap 5 training insitute | Best IT Training classes in Gurgaon | Web Designing Training Institute