CSS Fundamentals

A beginner-friendly notebook covering the building blocks of CSS — selectors, the box model, layout with Flexbox and Grid, responsive design, animations, and modern features. Pairs directly with the HTML Fundamentals notebook.

Introduction to CSS

What is CSS?Adding CSS to HTML (Inline, Internal, External)

CSS Syntax & Selectors

CSS Syntax Basics Types of Selectors

The Box Model

Understanding the Box Model Margin, Border, and Padding in Practice

Colors, Units & Typography

Colors and Units Typography Basics

Backgrounds & Borders

Background Properties Border and Border-radius

Display & Positioning

The Display Property Position Property

Flexbox

Flexbox Fundamentals Flexbox Alignment & Ordering

CSS Grid

Grid Fundamentals Grid Template Areas & Alignment

Responsive Design & Media Queries

Why Responsive Design Matters Media Queries & Breakpoints

CSS Specificity & Cascade

Understanding the Cascade Specificity Rules

Pseudo-classes & Pseudo-elements

Common Pseudo-classes Pseudo-elements

Transitions & Animations

CSS Transitions CSS Animations & Keyframes

Transforms

2D Transforms 3D Transforms & Perspective

CSS Variables (Custom Properties)

Declaring and Using Variables Theming with CSS Variables

Modern CSS Features

Container Queries & :has()CSS Nesting & Logical Properties