Close

Article News Card

This is an example of an Article News Card, designed using CSS, HTML, and JavaScript. JavaScript functions have been used to implement hover animations. The images have been imported to the form with their URLs. The body of the form is given a style set of background as darken(@white, 5%), font-family as 'proxima-nova-soft', sans-serif, and font-size as 14px. The month section of the thumbnail is given the styles font-size as 12px, background as @accent, and text-transform as uppercase. The title is given the styles color: @dark_gray, font-size: 26px, and font-weight: 700 whereas the subtitle is given the styles color: @accent, font-size: 20px, and font-weight: 400. The description has the styles color: @gray, font-size: 14px, and line-height: 1.8em. In a hover event, the description section takes the styles display: block, height: auto, and opacity: 1. Source: https://codepen.io/andytran/pen/BNjymy/

Post Comment or Questions

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

Your email address will not be published.