→ Mateo Rojas
→ Basic Footer

Basic Footer

Standard footer example with bootstrap 5

This bootstrap css example is contributed by Mateo Rojas, on 21-Dec-2024. Component is made with bootstrap css v.5.3. It is responsive.

Tags: Footer

Author Mateo Rojas

12.6k

v.5.3

Fork Fullscreen

<footer class="footer">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-md-6">
                <div class="footer-brand">CompanyName</div>
                <p class="footer-text">Creating amazing experiences and innovative solutions for our customers
                    worldwide.</p>
                <div class="social-links">
                    <a href="#" class="social-link"><i class="fab fa-twitter"></i></a>
                    <a href="#" class="social-link"><i class="fab fa-facebook"></i></a>
                    <a href="#" class="social-link"><i class="fab fa-instagram"></i></a>
                    <a href="#" class="social-link"><i class="fab fa-linkedin"></i></a>
                </div>
            </div>

<div class="col-md-6 text-md-end">
                <ul class="footer-links">
                    <li><a href="#">About</a></li>
                    <li><a href="#">Services</a></li>
                    <li><a href="#">Contact</a></li>
                    <li><a href="#">Privacy</a></li>
                    <li><a href="#">Terms</a></li>
                </ul>
            </div>
        </div>

More Examples

Responsive footer using HTML and Bootstrap:
HTML: Error Title: A large, bold number (e.g., 404) to indicate the error type. Error Message: A brief message explaining the error. Button: A button to navigate back to the home page. Adjust the href attribute to point to your actual home page URL. CSS: Background Gradient: Applied to the body to give a stylish look. Error Container: Centered on the page with a semi-transparent background for contrast. Button Styling: Custom colors for the button, including hover effects. How to Use: Create an error.html file and paste the above code into it. Place the error.html file in your web server’s error pages directory or configure your server to serve this file on error.

Author:
zobaidul kaziex

2 years ago

10.6k

v.4.6
home page

Author:
lamiajahan

2 months ago

160

v.4.6
Jquarry

Author:
Zahid Hasan Riyad

1 month ago

242

v.5.3
siam footer
footer

Author:
MD Siam Miya

4 months ago

350

v.4.6
Home Page of portfolio (WDD)

Author:
sajid taz

3 months ago

617

v.4.6
service

Author:
lamiajahan

2 months ago

152

v.4.6
fitar footer
do not copy

Author:
Fitar Ahmed

4 months ago

826

v.4.6
E-com Home Page

Author:
Creative Araf

2 months ago

114

v.5.3
Personal Portfolio About Section

Author:
Creative Araf

2 months ago

347

v.5.3
E-Commerce Cart Section

Author:
Creative Araf

2 months ago

270

v.5.3
E-Commerce Checkout Section

Author:
Creative Araf

2 months ago

216

v.5.3
Personal Portfolio Service Section

Author:
Creative Araf

2 months ago

306

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent