Curriculum (16+ hours)

What is CSS?

30 minutes - FREE

Learn what CSS is and why we use it. Start with some basic syntax and get comfortable with our code editor.

Steps: 3

Tag Selector - Colors

60 minutes - FREE

Start by selecting tags and learning how to change colors. We will also cover different ways to represent colors in CSS. Finally, learn how to mix and match colors. Perfect for those that lack an eye for design.

Steps: 8

Class Selector - Fonts & Text

70 minutes - FREE

Graduate to class selectors as we discuss the importance of classes in today's world of CSS. Learn industry best practices and how to manipulate text styles. Finally we will load in external fonts.

Steps: 6

ID Selector - Units

120 minutes

While rarely used, ID Selectors are still important to learn for CSS (and later Javascript). We will also cover the range of unit measurements CSS accepts, and discuss pros and cons of each.

Steps: 0

Parent Child Selector - Positioning & Display

110 minutes

Let's combine all of our selectors and use inheritance. We will also learn how to properly position things on the page and what the different display types do in CSS.

Steps: 0

Psuedo Selectors - Backgrounds & Borders

80 minutes

Finally, the last of the selectors, Psuedo, Before, After & Attribute. These are the least used, but some of the most powerful and expected. We will also cover Backgrounds & Borders and how to properly use images in CSS.

Steps: 0

Reset Styles - Box-Model

45 minutes

Learn why most professionals start their CSS with a general Reset. You've heard of the box-model, now let's break it down into it's 4 parts. Margin, Border, Padding & Content. Learn the biggest hack in CSS history.

Steps: 0

Specificity - CSS Math

30 minutes

Believe it or not, CSS isn't just an art form, it's also Mathematics. Learn what goes on behind the scenes with CSS Specificity. Learn WHY CSS just works.

Steps: 0

FontAwesome - Icons

30 minutes

We all love icons, and FontAwesome makes it so easy to include icons in your website that are scalable and do not lose quality. Learn all of the magic of FontAwesome and how easy it is to master it.

Steps: 0

Responsive - Mobile Design

120 minutes

One of the most in-demand skills of modern CSS Developers is the ability to design for all screen-sizes. Learn what employers mean when they ask for "Responsive Experience". How can you easily design for screens as large as billboards and as small as a SmartWatch.

Steps: 0

Flexbox - Magic

45 minutes

Positioning has been fun but hard, make it easy and magical with CSS' built in Flexbox.

Steps: 0

Animation - Transitions

50 minutes

Make your designs come to life with Animations. Learn about the Transition and Transform properties and even how to keyframe with CSS.

Steps: 0

Sass - Variables & Functions

45 minutes

Who said CSS is not a programming language? Now it can be with Sass! Go deep into the world of CSS Preprocessors and how you can use variables, functions and more to automate your CSS.

Steps: 0

Frameworks - Bootstrap & Materialize

50 minutes

Sometimes you just need to get things prototyped quickly. Maybe you want to focus on functionality and not design. Frameworks can cut out a lot of legwork when it comes to CSS and Design. Notice we learn this almost last, after you have become a professional CSS Developer.

Steps: 0

Chrome Developer Tools - Design Inspiration

70 minutes

One of the most essential skills when debugging CSS is the Chrome Developer Tools. Learn from others and style directly in the browser instead of your code editor. Mastering Dev Tools will save you hours every week.

Steps: 6

Start Learning

Login