Applying Special Effects to a Site Using CSS

By Nate Taylor
CSS is essential in controlling how a site looks and feels. This course will teach you how to move beyond basic stylings to apply various effects such as shadows and animations using purely CSS.
Play course overview
Course info
Rating
(27)
Level
Intermediate
Updated
Jun 3, 2020
Duration
1h 54m
Table of contents
Course Overview
Course Overview 1m
Creating Rounded Corners
Creating Rounded Corners 3m Basic Rounded Corners 4m Creating Round Objects 5m Customizing Border Radius 5m Advanced Border Radius 4m
Adding Box Shadows
Adding Box Shadows 3m Blurring the Shadow 3m Shadows on More Than One Side 6m Changing Shadow Size 3m Multiple Box Shadows 4m
Transitioning between States
Transitioning between States 3m Controlling the Transition 6m Transitiong without Hovering 4m Creating the Left Nav 3m Independent Transitions 5m Waiting on Transitions 3m Transition Shorthand 3m
Transforming Elements
Transforming Elements 1m Rotating an Object 2m Transform Functions 5m 3D Transforms 4m Setting up the Cards 5m Flipping the Cards 5m
Creating Animation
Creating Animations 2m Trigger a Transition on Click 4m Basic Animation 4m Looping Animations 3m Keeping the Last Animated Frame 3m Controlling How Animations Restart 2m Multiple Animations 5m How Did We Get Here? 3m
Description
Course info
Rating
(27)
Level
Intermediate
Updated
Jun 3, 2020
Duration
1h 54m
Description

CSS provides you the ability to control the fonts, colors, layouts, and spacing used on your website. However, it can do more than that. It can also provide an interactive experience to your users. In this course, Applying Special Effects to a Site Using CSS, you’ll learn to improve the look and feel of websites that you build. First, you’ll explore creating rounded corners using CSS. Next, you’ll discover how to apply box shadows to objects. Finally, you’ll learn how to create animations using CSS transforms and transitions. When you’re finished with this course, you’ll have the skills and knowledge of CSS special effects needed to improve the look and feel of any website you create.

About the author
Nate Taylor
About the author

Nate's first program was written in QBasic on an 8086 clone his dad built. Since then he's written applications in C++, .NET, and Node.js.

More from the author
Postman Fundamentals
Beginner
2h 29m
Jul 21, 2021
Mocking Node.js with Sinon
Intermediate
1h 25m
May 19, 2021
JavaScript REST APIs: The Big Picture
Beginner
38m
Nov 20, 2020
More courses by Nate Taylor
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hi, everyone. My name is Nate Taylor, and welcome to my course, Applying Special Effects to a Site Using CSS. I am a solution architect and Aviture in Omaha, Nebraska. CSS can do a lot more than just control colors and layout. It can also define how objects transition from one state to another. It also is possible to create animations on your site using nothing but CSS. This course is designed to gradually walk you through various effects that you can add to your site using nothing but CSS. Some of the major topics that we will cover include rounding the corners of your objects, creating shadows underneath objects, changing the appearance of objects when their state changes, and even animating objects on your site. By the end of this course, you'll know how to round corners, add shadows, control how objects transition, and even perform those animations using nothing but CSS. Before beginning the course, you should be familiar with the fundamentals of CSS. I hope you'll join me on this journey to learn more about CSS with the Applying Special Effects to a Site Using CSS course at Pluralsight.

You're the smartest person in the room

PROVE IT

Your team won't just close the skills gap

THEY'LL HURDLE IT