Creating Elegant Navigation Using CSS3 Transitions

In this series of CSS tutorials we'll talk about a commonly overlooked element of design: what do elements look like between the change from one state to another? When creating a visual design for a website, it is really easy to overlook the interactive elements of a website. Software required: Brackets, Google Chrome.
Course info
Rating
(131)
Level
Beginner
Updated
Feb 11, 2015
Duration
1h 2m
Table of contents
Description
Course info
Rating
(131)
Level
Beginner
Updated
Feb 11, 2015
Duration
1h 2m
Description

In this series of CSS tutorials we'll talk about a commonly overlooked element of design: what do elements look like between the change from one state to another? When creating a visual design for a website, it is really easy to overlook the interactive elements of a website. So in this course, we'll look at how to style interaction using the CSS3 transition property. As a result we'll create more elegant navigation and examine the transition from a default link state to a hover link state. Since we'll be using CSS, this course assumes previous CSS training to be able to follow along. Software required: Brackets, Google Chrome.

About the author
About the author

Susan is a web design author for Pluralsight. Growing up, Susan was both a passionate artist as well as a computer tech aficionado. When she discovered the world of web development, she found that she could meld those two passions together into something amazing. Soon after, Susan began devoting herself to building beautiful and functional web content for businesses and nonprofits. It was through those experiences Susan developed a fluency for web coding languages.

More from the author
Styling Websites with CSS
Beginner
1h 32m
Jun 19, 2020
Semantic HTML
Intermediate
1h 22m
Jul 19, 2019
UX Design Creating Wireframes
Intermediate
1h 29m
Jan 3, 2018
More courses by Susan Simkins