CSS

Styling your web pages

CSS lets you style your web pages. It works closely with HTML to lay out positioning, style, and the overall look of your pages. Things like colors, text sizes, and even animations can be done in CSS.

Start learning with

Google

Overview

CSS is the primary language used to style the web. Combined with HTML and other web technologies, it gives you full control over how things look on your website.

Who curated this track

Jon Chan
  • Founder of Bento
  • Developer at Stack Overflow
  • Self-taught developer
Foundations
 
CSS Fundamentals

(www.codecademy.com)

These are the very basics of how to use CSS, including how to include basic styles into an HTML file and the general structure and syntax of CSS.

30M

 
Styling with CSS

(www.codecademy.com)

With the basics of CSS under your belt, get an overview of how colors and fonts can be controlled on your website.

50M

 
Organizing HTML & CSS

(www.codecademy.com)

Structuring your HTML and CSS beyond basic elements is a key skill for web developers. Learn how to use both IDs and classes to organize your HTML and apply styles to groups of elements.

25M

 
The CSS Box Model

(www.codecademy.com)

The box model is an essential part of understanding how CSS and HTML work together. Understanding how to set the dimensions of an element will be key to your ability to create compelling websites.

1H

Practical CSS
 
Code Guide by @mdo

(mdo.github.io)

There are a number of style guides you can find on the Internet. Here's one that's easy to follow by the co-creator of Bootstrap.

15M

 
Web Design in 4 Minutes

(jgthms.com)

This is an amazing demonstration of how to use CSS to build a basic webpage. It gives you all the fundamental building blocks of a well designed page step-by-step.

4M

 
Learn CSS Layout

(learnlayout.com)

Putting CSS to work to practically create layouts for a webpage isn't exactly obvious from just learning the rules. Learn how to use positioning properties in CSS to organize and structure the content of your website.

1H

 
What are the Benefits of Using a CSS Framework?

(css-tricks.com)

A lot of the time you will be using the work of others when writing CSS. This pre-written CSS you can use are known as CSS frameworks. Learn about what they are and what their benefits are.

20M

Deep Dive into CSS
 
Introduction to BEM

(getbem.com)

Once you start working on very large projects with a lot of CSS in them, you will need to learn how to properly name and organize your styles. Block-Element-Modifier (or BEM) is a practice of how to organize your styles. Read this introduction to learn one method of keeping your CSS manageable.

45M

 
CSS Reference

(cssreference.io)

This is a comprehensive and visual guide to CSS properties. Give it a quick skim and keep this in your back pocket when you need to look something up in CSS.

30M

Start this track

What you should learn next

Sublime Text

Mastering your text editor will make you a better developer no matter what languages and frameworks you are using. Sublime Text is one of the most popular text editors for web developers, with its extensive package ecosystem, easy-to-use shortcuts, and dependability.