Close

Image with title and tag on hover

This is another example of a Card layout, designed using HTML, CSS, and JavaScript. JavaScript functions have been used to implement the mouse hover animations. The fonts and images are imported to the form with their URLs. The card is given an initial style set of font-family as 'Raleway', sans-serif, display as inline-block, color as #ffffff, margin: 10px, min-width: 230px; max-width: 315px and font-size as 16px. The image has the styles of vertical-align as top and backface-visibility as hidden. The header inside the card is given the styles transform as translateY(-100%), transition-delay as 0.05s, font-weight: 400, margin-bottom: 5px, text-transform as uppercase to transform the text to uppercase automatically and font-weight as 400. The sub heading inside the card is given the color #ae895d, transform as translateY(-100%), padding: 3px 10px, font-weight as normal, and transition-delay as 0s. Source: https://littlesnippets.net/snip1584

Post Comment or Questions

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

Your email address will not be published.

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.