This is a solution to the Blog preview card challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- See hover and focus states for all interactive elements on the page
I learned about both pseudo-classes and the filter function, and how to add the hover state and the drop shadow styling 🤓
-
Hover effect styling in CSS: https://www.w3schools.com/CSSref/sel_hover.php
-
Pseudo-classes: https://www.w3schools.com/CSSref/css_ref_pseudo_classes.php
- ☝️ These links helped me learning about pseudo-classes in CSS and how to add the hover effect styling!
-
Drop shadow styling in CSS: https://www.w3schools.com/cssref/func_drop-shadow.php
-
Filter function: https://developer.mozilla.org/en-US/docs/Web/CSS/filter-function
- ☝️ These links helped me learning about the filter function and how to add the drop shadow effect in CSS!