From the course: CSS: Images

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Animated effects

Animated effects

- [Instructor] One benefit to using CSS to transform images either by changing their shape, changing their size, their position, their color, or anything else is, in CSS, you can usually apply either transforms or animations to those properties. And that's the case for pretty much everything we've covered so far in the course. This allows us to create some really interesting interactive interfaces. And I've created a basic example here, just to show you what's possible and show you how it fits together. First off, I've set up a grid is a two by two grid and then just let the images place themselves in the grid. I've then cropped them down to squares like we've done previously. And then finally, for each of the image elements I've grabbed the figure element that wraps around the image, and applied clip path circle. Now, in this case I've set the diameter of the circle to 100% which means the diameter is the same height…

Contents