Site logo

CssLessons

Teaching CSS, the right way.

Navigation

Home

Cascading Style Sheets

Cascading Style Sheets (CSS) is the language used to drive how web pages will look. While HTML provides the structure and content, CSS handles the layout, colors, spacing, and overall visual design.

Originally introduced in the mid-1990s, CSS has evolved into a powerful styling language that supports all sorts of features across many browsers and devices.

Every web developer should understand how to use CSS to create clean, consistent, and user-friendly interfaces. This is especially true in a world where sites must look great on everything from phones to enormous TVs.

Audience

These lessons are for individuals who are comfortable with the basics of HTML and are ready to take the next step into styling and layout. If you've completed my HtmlLessons series, or you already know how to create simple web pages but want them to look nice, then these lessons are for you.

This course is designed as a gentle introduction to the fundamentals of CSS. You'll learn how to style text, provide colors and sick graphics, work with the box model, create flexible layouts, and start building responsive designs. The focus is on making CSS concepts clear and approachable, so you can quickly apply what you learn to real web pages.

You'll work through easy-to-follow examples, practical exercises, and small projects that build your confidence step-by-step. The goal is to give you solid front-end foundations that will support you in any direction you take.

What These Lessons Are Not

I will not be going over every single CSS concept, there is simply too much material to cover. Instead, the idea behind these lessons is to simply give you a foundation to build off of.

Also keep in mind that these are lessons, not documentation. If you need a list of properties and their documentation, then perhaps the definitive place would be Mozilla Developer Network's list of CSS properties (opens in a new tab).

Prerequisites

Technically speaking, CSS is not a programming language, it is a style sheet language used to describe how HTML content should look. To follow along with these lessons, you should be familiar with basic HTML.

You can write CSS in any text editor, such as Notepad or TextEdit. However, if you would like features like syntax highlighting, autocompletion, and better file management, here are some popular options:

To see your styles in action, you'll link your CSS files to an HTML page and open that page in your browser. If you prefer to experiment in an online environment instead of working with local files, here are some popular options:

A modern web browser (such as Chrome, Firefox, Edge, or Safari) with built-in developer tools will also be very helpful for inspecting elements and experimenting with styles directly in the page.