Close

User Profile Card

This is an example of a bootstrap user profile card layout with hover effects, designed using HTML, CSS, JavaScript and bootstrap framework 4. The images and fonts are imported to the code with their URLs. JavaScript mouseleave() function has been used to implement the hovering effects. The body of the card is given the styles of font-family as 'Roboto', Arial, sans-serif, margin as 10px, min-width as 230px, max-width as 315px, color as #ffffff, line-height as 1.4em, and background-color as #141414. The profile picture is given an opacity of 0.85. The Follow and More info buttons are given a text-transform style as uppercase to automatically convert the text to uppercase. The designation title has the styles of font-size as 0.5em, and color as #2980b9. The buttons take an opacity value of 1, in a hover event. The Follow button is given a border and a background color as #2980b9. Source: https://codepen.io/uname79/pen/XWJzjJv

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 *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

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