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.
Experimentation through image filters - WordPress Tutorial
From the course: Learning Responsive Web Design in the Browser
Experimentation through image filters
- [Voiceover] Advanced CSS has started moving beyond merely styling and transforming containers to changing the appearance and behavior of the contents within those containers. One such example that will become more and more prevalent in the next while is the filter property. Filter allows us to augment the output of elements before they are rendered in the browser by applying filters you typically expect to see in an image editor. Blur, contrast, drop shadow, grayscale opacity, sepia, and other options. These filters can be applied to images, backgrounds, and borders. The filter property gives us a whole new level of design control in the browser, and let's us experiment with things like colors and contrast before making final decisions about what to display in the site. Let me show you an example. Let's say I'm considering displaying the images in the three boxes in grayscale, and then transitioning them to color when they're hovered over or focused. I can do this using the filter…
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.