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
(10)
Level
Intermediate
Updated
Jun 3, 2020
Duration
1h 54m
Table of contents
Course Overview
Course Overview 1m
Creating Rounded Corners
Advanced Border Radius 4m Basic Rounded Corners 4m Creating Round Objects 5m Creating Rounded Corners 3m Customizing Border Radius 5m
Adding Box Shadows
Adding Box Shadows 3m Blurring the Shadow 3m Changing Shadow Size 3m Shadows on More Than One Side 6m Multiple Box Shadows 4m
Transitioning between States
Transitioning between States 3m Transitiong without Hovering 4m Controlling the Transition 6m Creating the Left Nav 3m Independent Transitions 5m Transition Shorthand 3m Waiting on Transitions 3m
Transforming Elements
Setting up the Cards 5m 3D Transforms 4m Flipping the Cards 5m Rotating an Object 2m Transform Functions 5m Transforming Elements 1m
Creating Animation
Basic Animation 4m Controlling How Animations Restart 2m Creating Animations 2m How Did We Get Here? 3m Keeping the Last Animated Frame 3m Looping Animations 3m Multiple Animations 5m Trigger a Transition on Click 4m
Description
Course info
Rating
(10)
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
Building CRUD Actions in a JavaScript REST API
Intermediate
1h 40m
Sep 30, 2020
Postman Fundamentals
Beginner
2h 37m
Apr 17, 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