in this chapter, we will see together how to create the website footer.
i will give you the full source code but if you didn't saw the previous chapter i advice you to visit theme to see the full source code
HTML
<footer>
<div class="social">
<h1>Follow us</h1>
<ul>
<li><img src="img_ressource/facebook_circle_color-512.png"></li>
<li><img src="img_ressource/if_instagram_circle_color_107172.png"></li>
<li><img src="img_ressource/youtube_circle_color-512.png"></li>
<li><img src="img_ressource/twitter_circle_color-512.png"></li>
</ul>
</div>
<div class="copyright">
<p>© Made with ♥ By Doctor Code</p>
</div>
</footer>
CSS
footer{
position: relative;
background-color: #2f2f2f;
clear: both;
}
footer .social{
position: relative;
padding: 30px 0;
}
footer .social h1{
text-align: center;
color: #f2f2f2;
margin-bottom: 15px;
}
footer .social ul{
text-align: center;
margin-bottom: 15px;
}
footer .social ul li{
display: inline-block;
margin-right: 15px;
}
footer img{
width: 48px;
}
footer .copyright{
background-color: #212121;
padding: 5px 15px;
text-align: center;
color: #f2f2f2;
}
thank you for following us
Create a blog template using HTML and CSS : the footer
Reviewed by Medics
on
May 01, 2019
Rating:
Reviewed by Medics
on
May 01, 2019
Rating:

No comments: