"footer bootstrap 4"
Bootstrap 4.1.1 Snippet by Shivamsemisetia

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <footer> <div class="foter_sec"> <div class="container"> <div class="row main_foter"> <div class="col-lg-4 col-md-6 col-sm-12 col-xs-12 foter_content"> <h5 class="foter_title">shaek</h5> <p>Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the moreture, discovered the undoubtable source.</p> </div> <div class="col-lg-2 col-md-3 col-sm-4 col-xs-12 foter_content"> <h5 class="foter_title">Useful Links</h5> <ul> <li><a href="">Home</a></li> <li><a href="">About Us</a></li> <li><a href="">Our Causes</a></li> <li><a href=""> Events</a></li> <li><a href="">Contact</a></li> </ul> </div> <div class="col-lg-2 col-md-3 col-sm-4 col-xs-12 foter_content"> <h5 class="foter_title">Our Causes</h5> <ul> <li><a href="">Water Purify</a></li> <li><a href="">Food Collect</a></li> <li><a href="">Health Fund</a></li> <li><a href="">Free Education</a></li> <li><a href="">Poor Health</a></li> </ul> </div> <div class="col-lg-4 col-md-6 col-sm-4 col-xs-12 foter_content"> <h5 class="foter_title">Contact Us</h5> <ul> <li><a href="">123 City , United States <br>Of America 750.</a></li> <li><a href="">Office +1-234-567-891</a></li> <li><a href="">Contect@1.Com</a></li> </ul> <div class="icons"> <a href=""><i class="fa fa-facebook"></i></a> <a href=""><i class="fa fa-twitter"></i></a> <a href=""><i class="fa fa-linkedin"></i></a> <a href=""><i class="fa fa-instagram"></i></a> </div> </div> </div> </div> </div> <div class="copyright"> <div class="container"> <div class="row"> <div class="col-md-12 text-center text-center"> <p>© 2020 abc.Com All Rights Reserved.</p> </div> </div> </div> </div> </div> </footer>
/* ========================================================================== Footer Css Start ========================================================================== */ .foter_sec { background: #00003F; color: #fff; } .copyright { background: #000026; color: #fff; } .foter_content { padding: 30px 20px; } .foter_content p { font-size: 16px; line-height: 28px; padding-right: 25px; } .copyright p { font-size: 16px; line-height: 40px; padding: 10px 0; } .foter_title { font-size: 24px; line-height: 32px; padding-bottom: 10px; position: relative; margin-bottom: 15px; } .foter_title::after { position: absolute; content: ""; height: 2px; width: 42px; background: #F39811; bottom:0; left: 0; transition: width 0.5s ease, background-color 0.5s ease; } .foter_title:hover:after { width: 50%; } .foter_content ul{ list-style:none; margin:0; padding:0; } .foter_content ul li { padding: 7px 0; } .foter_content ul li a { color:#fff; } .foter_content ul li a:hover { color: #f39811; } .icons i { padding: 3px; margin-top: 5px; } .icons a { color:#fff; } .icons a:hover { color: #f39811; }

Related: See More


Questions / Comments: