From the course: Learning Responsive Web Design in the Browser
Join today to access over 22,600 courses taught by industry experts or purchase this course individually.
Interaction design through CSS - WordPress Tutorial
From the course: Learning Responsive Web Design in the Browser
Interaction design through CSS
- [Voiceover] Just like modern CSS allows us to do things like draw circles and flex our items to fit the available space, we can also use CSS to do many of the things that previously required either advanced imaging techniques or Javascript, or both. In this chapter I'll show you some of the most useful features we find in CSS that can do things you might not know were possible and help make your designs more interactive. To start off, let's look at some simple effects like drop shadows and transitions. Right now, when you hover over one of the three boxes toward the top of the Index page, nothing happens. We have yet to define either a hover or focus state for these links. Following modern flat design principles we can add a drop shadow to these boxes when they're interacted with, so they appear to lift off the page and above the background. And to make it more interactive, we'll do this gradually through a transition, so it literally looks like the box lifts off the page and then…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.