→ zobaidul kaziex
→ Responsive footer using HTML and Bootstr...

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.

This bootstrap css example is contributed by zobaidul kaziex, on 05-Sep-2024. Component is made with bootstrap css v.4.6. It is responsive.

Tags: Footer

Author zobaidul kaziex

10.5k

v.4.6

Fork Fullscreen

<body>
    
    <footer class="footer">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <p>&copy; 2024 Your Company. All Rights Reserved.</p>
                </div>
                <div class="col-md-6">
                    <div class="social-icons">
                        <a href="#" class="fab fa-facebook-f" title="Facebook"></a>
                        <a href="#" class="fab fa-twitter" title="Twitter"></a>
                        <a href="#" class="fab fa-linkedin-in" title="LinkedIn"></a>
                        <a href="#" class="fab fa-instagram" title="Instagram"></a>
                    </div>
                    <div class="footer-links">
                        <a href="#">Privacy Policy</a>
                        <a href="#">Terms of Service</a>
                        <a href="#">Contact Us</a>
                    </div>
                </div>
            </div>
        </div>
    </footer>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/js/all.min.js"></script>
</body>

More Examples

responsive footer
responsive footer with date and time

Author:
SHOURAV ISLAM

3 months ago

271

v.4.6
Personal Portfolio About Section

Author:
Creative Araf

2 months ago

299

v.5.3
E-Commerce Full

Author:
Zahid Hasan Riyad

1 month ago

322

v.5.3
Restaurant Menu Page

Author:
Creative Araf

1 month ago

116

v.5.3
Bootstrap copyright footer

Author:
Anonymous

2 years ago

5.5k

v.5.3
Footer example made with Bootstrap 5.3
Dark theme

Author:
Arturo

1 year ago

10.2k

v.5.3
footer(date-time)
footer(date-time)

Author:
Mustaq hussin

1 month ago

189

v.4.6
Footer
footer

Author:
Faysal

1 month ago

200

v.4.6
Elon Musk
nav and footer

Author:
RAHAT RAHMAN OFICIAL

3 months ago

362

v.4.6
contact

Author:
lamiajahan

1 month ago

99

v.4.6
fitar footer
do not copy

Author:
Fitar Ahmed

3 months ago

802

v.4.6
Restaurant About Page

Author:
Creative Araf

1 month ago

123

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent