"footer code full responsive"
Bootstrap 3.0.0 Snippet by dg393024

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/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 ----------> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <!--======================footer start======================--> <footer class="webintern-footer"> <div class="webintern-footer-inner"> <div class="container"> <div class="row"> <div class="col-sm-6 col-md-3 "> <a class="webintern-footer-logo" href="#"> <img class="img-responsive" src="https://www.freelogodesign.org/img/logo-ex-4.png" style="width:100px;" alt=""> </a> <div class="simple-text dark padding-sm"> <p>Totam rem aperiam, eaque ipsa quae ab illo inv ent ore veritatis et quasi architecto beatae vitae dict eaque ipsa quae ab.</p> </div> <div class="empty-space xs-25 sm-25"></div> </div> <div class="col-sm-6 col-md-2 footer-2"> <!-- webintern_footer_title --> <h4 class="webintern_footer_title h5"><small>Quick Links</small></h4> <ul class="webintern-footer-list"> <li><a href="#">Home</a></li> <li><a href="#">About Us</a></li> <li><a href="#"> Services </a></li> <li><a href="#"> Projects </a></li> <li><a href="#"> Portfolio </a></li> <li><a href="#">Contact Us</a></li> </ul> <div class="empty-space xs-25 sm-25"></div> </div> <div class="col-sm-6 col-md-3 footer-3"> <!-- webintern_footer_title --> <h4 class="webintern_footer_title h5"><small> Our Courses </small></h4> <ul class="webintern-footer-list"> <li><a href="#">HTML / CSS / JS </a></li> <li><a href="#">PHP</a></li> <li><a href="#">JAVA</a></li> <li><a href="#">.NET</a></li> <li><a href="#">Android</a></li> <li><a href="#">ISO</a></li> </ul> <div class="empty-space xs-25"></div> </div> <div class="col-xs-12 col-md-4 col-sm-6"> <div class="marg-sm-b30"></div> <!-- webintern_footer_title --> <h4 class="webintern_footer_title h5"><small>Subscribe Newsletter</small></h4> <div class="empty-space marg-lg-b20"></div> <!-- <div class="simple-text last dark "> <p>Get latest updates and offers.</p> </div> --> <div class="empty-space marg-lg-b15"></div> <!-- TT-SUBSCRIBE --> <form method="post"> <div class="tt-subscribe"> <input type="text" required="" placeholder="Enter your email"> <div class="tt-subscribe-submit"> <i class="fa fa-envelope" aria-hidden="true"></i> <input type="submit" value=""> </div> </div> </form> <div class="empty-space marg-lg-b30"></div> <!-- TT-SOCAIL --> <ul class="tt-socail"> <li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li> <li><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li> <li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li> <li><a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li> </ul> </div> </div> </div> </div> <div class="tt-copy"> <div class="container"> <div class="row"> <div class="col-sm-6"> <div class="tt-copy-left">Copyright © company 2018. All rights reserved. </div> </div> <div class="col-sm-6"> <div class="tt-copy-right"> Created by: compny </div> </div> </div> </div> </div> </footer>
/*=================footer css start==============*/ .webintern-footer { background: #0d2034; } .webintern-footer-inner { padding-top: 80px; padding-bottom: 50px; } .webintern-footer-logo { display: inline-block; } .webintern-footer .webintern-footer-inner .simple-text p { color: #fff; margin-top: 20px; margin-bottom: 15px; } .simple-text p { font-size: 15px; color: #42435d; font-family: 'Open Sans', sans-serif; font-weight: 400; line-height: 26px; margin-bottom: 0; } .webintern-footer .webintern-footer-inner .simple-text a { font-family: 'Open Sans', sans-serif; font-weight: 700; color: #f2c21a; font-size: 15px; } .footer-2 { padding-left: 55px; } .webintern_footer_title { margin-top: 0px; margin-bottom: 25px; } .webintern_footer_title small { font-family: 'Work Sans', sans-serif; color: #fff; font-weight: 700; font-size: 18px; text-transform: uppercase; } .webintern_footer_title:after { content: ''; display: block; width: 30px; height: 2px; background: #f2c21a; margin-top: 15px; } .webintern-footer-list { padding: 0; } .webintern-footer-list li { margin-bottom: 17px; list-style: none; } .webintern-footer-list a { position: relative; font-size: 15px; line-height: 18px; color: #fff; padding-left: 0; letter-spacing: 0.20px; font-family: 'Open Sans', sans-serif; } .footer-3 { padding-left: 65px; } .webintern-footer-inner .simple-text.last { color: #d5d5d5; font-size: 17px; font-style: italic; font-family: 'Open Sans', sans-serif; font-weight: 400; } .tt-subscribe { position: relative; } .tt-subscribe input:not([type="submit"]) { width: 100%; height: 46px; background: #fff; font-size: 15px; color: #838486; padding-left: 20px; padding-right: 70px; border: 2px solid #fff; -moz-border-radius: 3px; border-radius: 3px; } .tt-subscribe-submit { background: #001b57; } .tt-subscribe-submit { position: absolute; top: 0; right: 0; width: 52px; height: 46px; font-size: 18px; line-height: 46px; color: #2a2a2a; text-align: center; background: #001b57; -moz-border-radius-topright: 3px; border-top-right-radius: 3px; -moz-border-radius-bottomright: 3px; border-bottom-right-radius: 3px; } .tt-subscribe-submit i.fa-envelope:before { content: "\f0e0"; position: relative; z-index: 1; color: #fff; } .tt-subscribe-submit input { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #51658d; border: 0; } ul.tt-socail { padding: 0; margin-top: 30px; } .tt-socail li { display: inline-block; margin-right: 10px; } .tt-socail a { display: block; width: 36px; height: 36px; font-size: 17px; line-height: 34px; color: #fff; text-align: center; border: 1px solid #fff; -moz-border-radius: 100%; border-radius: 100%; } .webintern_footer_title small { font-family: 'Work Sans', sans-serif; color: #fff; font-weight: 700; font-size: 18px; text-transform: uppercase; } .tt-copy { font-size: 15px; line-height: 20px; color: #fff; background: #51658d; padding: 30px 0; font-family: 'Open Sans', sans-serif; } .tt-copy-right { text-align: right; }

Related: See More


Questions / Comments:

how to download this tempate?

bhakti02 () - 4 years ago - Reply 0