1+ Footer Components - Bootstrap

The footer is an essential component of any website, providing important information, links, and navigation options at the bottom of the page. With Bootstrap, creating stylish and functional footers is straightforward. In this collection, we've assembled a variety of Bootstrap footer designs that you can seamlessly incorporate into your website's layout. Whether you're building a personal blog, an e-commerce platform, or a corporate website, our collection offers options to enhance the visual appeal and navigation of your website's bottom line. Let's explore how Bootstrap footers can elevate the overall design and user experience of your website!

Bootstrap 4 Footer with Sub Links

Elevate your website's footer with sub-links for enhanced navigation using Bootstrap 4. Learn how to easily add additional links and information to your footer for improved user engagement.

Author: Admin

Preview
Code

<div class="container">
  <h1>Content Goes Here</h1>
  <p>This is just a sample content.</p>
</div>

<footer class="text-center bg-dark text-white py-4 fixed-bottom">
  <div class="container">
    <p>&copy; 2024 Your Website</p>
    <ul class="list-inline">
      <li class="list-inline-item"><a href="#">Home</a></li>
      <li class="list-inline-item"><a href="#">About</a></li>
      <li class="list-inline-item"><a href="#">Services</a></li>
      <li class="list-inline-item"><a href="#">Contact</a></li>
    </ul>
    <p>Designed with <span class="text-danger">&hearts;</span> by Faraz</p>
  </div>
</footer>

footer ul li a {
  color: #fff;
}
footer ul li a:hover {
  text-decoration: underline;
}

```
No need of JavaScript
```

Bootstrap 4 Simple Inline Footer

Enhance your website's design with a clean and minimalist inline footer using Bootstrap 4.

Author: Admin

Preview
Code

<div class="container">
  <h1>Content Goes Here</h1>
  <p>This is just a sample content.</p>
</div>

<footer class="text-center bg-dark text-white py-4 fixed-bottom">
  <div class="container">
    <p>&copy; 2024 Your Website</p>
    <p>Designed with <span class="text-danger">&hearts;</span> by Faraz</p>
  </div>
</footer>

```
No Custom CSS
```
```
No need of JavaScript
```