API tools faq
paste
reenadak

2018-11-07_boostrap4_menu

reenadak
Nov 7th, 2018
138
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.20 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>Bootstrap Example</title>
  5. <meta charset="utf-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
  8. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  9. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
  10. <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
  11. </head>
  12. <body>
  13.  
  14. <nav class="navbar navbar-expand-lg navbar-light bg-light">
  15.  
  16. <a class="navbar-brand" href="#">Navbar</a>
  17. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  18. <span class="navbar-toggler-icon"></span>
  19. </button>
  20.  
  21. <div class="collapse navbar-collapse" id="navbarSupportedContent">
  22. <ul class="navbar-nav mr-auto">
  23. <li class="nav-item active">
  24. <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
  25. </li>
  26. <li class="nav-item">
  27. <a class="nav-link" href="#">Link</a>
  28. </li>
  29. <li class="nav-item dropdown">
  30. <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
  31. Dropdown
  32. </a>
  33. <div class="dropdown-menu" aria-labelledby="navbarDropdown">
  34. <a class="dropdown-item" href="#">Action</a>
  35. <a class="dropdown-item" href="#">Another action</a>
  36. <div class="dropdown-divider"></div>
  37. <a class="dropdown-item" href="#">Something else here</a>
  38. </div>
  39. </li>
  40. <li class="nav-item">
  41. <a class="nav-link disabled" href="#">Disabled</a>
  42. </li>
  43. </ul>
  44. <form class="form-inline my-2 my-lg-0">
  45. <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
  46. <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
  47. </form>
  48. </div>
  49. </nav>
  50.  
  51.  
  52. </body>
  53. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!