What is CSS?

CSS is a language for describing how HTML looks. Selector, property, value — that's the whole syntax.

3 min read Level 1/5 #css#intro#basics

What you'll learn

Recognize CSS syntax
Know the three ways to apply CSS
Pick the right approach

CSS — Cascading Style Sheets — is the language that controls how HTML looks. Colors, fonts, layout, spacing, animations — all CSS.

The Syntax

h1 {
  color: tomato;
  font-size: 2rem;
  margin-bottom: 1rem;
}

Selector — h1 — what to style
Block — { ... } — the rules
Property — color, font-size, margin-bottom
Value — tomato, 2rem, 1rem
Each declaration ends with ;

Three Ways to Apply CSS

1. External stylesheet (the standard way)

<head>
  <link rel="stylesheet" href="/styles.css" />
</head>

/* styles.css */
h1 { color: tomato; }

The CSS file is cached, shared across pages, and easy to edit.

2. `<style>` block in the HTML

<head>
  <style>
    h1 { color: tomato; }
  </style>
</head>

Fine for one-page demos or critical above-the-fold CSS.

3. Inline `style` attribute

<h1 style="color: tomato;">Hello</h1>

Highest specificity, hard to maintain. Use only for one-off dynamic styles (set from JS, or per-element CSS variables).

Comments

/* this is a comment */
/* comments can span
   multiple lines */

CSS has only one comment style — /* ... */. No //.

CSS Is Forgiving

Unknown properties, malformed values, missing semicolons — the browser ignores them and moves on. This is good for forward compatibility (new CSS features just fail silently in old browsers) and bad when you have a typo (silent failure).

DevTools’ computed styles panel shows what actually applied.

Up Next

The selector — the bit before the {.

Selectors →