HTML5 – Bootstrap

Bootstrap is a front-end framework that provides a range of pre-styled and responsive UI components for building modern and responsive websites. Some of the key features of Bootstrap include:

  • Grid system: Bootstrap provides a responsive grid system that allows you to create layouts that adapt to different screen sizes.
  • UI components: Bootstrap provides a range of UI components such as buttons, forms, navbars, and modals that are pre-styled and responsive.
  • Responsive design: Bootstrap is built with responsive design in mind, and the UI components are designed to adapt to different screen sizes.

Here is an example of how to use Bootstrap to create a simple navbar:

<code><nav class="navbar navbar-expand-lg navbar-light bg-light">
  <a class="navbar-brand" href="#">My Website</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav</code>"> 
<code>        </code><li class="nav-item active"> <a class="nav-link" href="#">Home</a> </li> 
<code>        </code><li class="nav-item"> <a class="nav-link" href="#">About</a> </li> 
<code>        </code><li class="nav-item"> <a class="nav-link" href="#">Contact</a> </li> 
<code>    </code></ul> 
<code><code>  </code></code></div> 
</nav> 

In this example, the navbar class is used to create a navbar, and the navbar-expand-lg class is used to create a responsive navbar that collapses on small screens. The navbar-light and bg-light classes are used to style the navbar. The navbar-brand class is used to create the brand logo, and the navbar-toggler class is used to create the toggle button for the navbar on small screens. The collapse navbar-collapse class is used to create the navbar menu, and the navbar-nav class is used to style the navbar menu.