Close

Simple Responsive Bootstrap footer

This is another example of a bootstrap footer template with hover effects, designed using HTML, CSS, JavaScript and Bootstrap framework 4. The icons and images are imported to the code with their URLs. The concept of Lists has been used with UL and LI components. UL element has been used with the child elements of LI to display the details in an orderly manner. JavaScript functions have been used to display the "Top" button when the sure scrolls down 20px from the top of the form and take the user back to the top when it's clicked. The column headings are given the styles of font-size as 2rem, text-transform as uppercase automatically convert the text to uppercase, color as #304f50, font-weight as 500, margin as 1rem 0, padding as .4rem 0px, border-bottom as 1px solid #c7c7c7, and letter-spacing as 3px. The list items are given a font color as grey, which changes to #ff6600, in a hover event. The bottom footer is given a background color as cadetblue and font color as white. The button is given a font-size of 18px, cursor style as pointer to get the hand cursor effect, and a background color of #304f50, which changes to #555, in a hover event. Source: https://codepen.io/hanabach/pen/xBvJqX

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.