Most of the time when we visit a website, what really catches our attention is the design. This is why having some effects on the elements can make a difference.
With that in mind, let's create a card with an img and two buttons and add some nice effects to them.
These are the tasks you should complete for the img element:
Set a transition effect.
Give the transition a duration value between .1s and 2s, and a time-function.
When the mouse hovers over the image, make it scale by a value of 1.15.
These are the tasks you should complete for both button elements:
Give the transition two properties: opacity first and transform second.
For each property, set a transition duration value between .1 and 2s, and a time-function.
When the mouse hovers over the button, decrease the opacity to 70%.
When the mouse hovers over the button, make it scale by a value of 1.1.
The end result should look like this: