CSS (Cascading Style Sheets) is a stylesheet language used to control the visual presentation of HTML documents. It defines how elements are displayed — including colours, fonts, spacing, and layout — across all screen sizes and devices.

What is CSS? — Code Tutorium

Q: What does CSS stand for?

CSS stands for Cascading Style Sheets. 'Cascading' refers to the way multiple style rules can apply to the same element, with the browser resolving conflicts using specificity and source order.

Q: What is CSS used for?

CSS is used to style and lay out web pages. It controls colours, fonts, spacing, animations, responsive layouts, and much more. Every modern website uses CSS, including YouTube, Google, Amazon, and Instagram.

Q: What is the difference between HTML and CSS?

HTML provides the structure and content of a web page (headings, paragraphs, images, links). CSS controls how that content looks — colours, fonts, layout, and spacing. HTML is the skeleton; CSS is the skin.

What is CSS?

CSS (Cascading Style Sheets) is a stylesheet language used to describe the visual presentation of an HTML or XML document. In plain English: HTML builds the structure of a web page, and CSS makes it look good.

First proposed by Håkon Wium Lie in 1994, CSS was designed to give developers full control over how web content is displayed — separating design from document structure.

💡 In simple terms

HTML is the skeleton of a web page. CSS is the skin — it controls every colour, font, margin, and animation you see.

What does CSS stand for?

CSS stands for Cascading Style Sheets. Each word matters:

Cascading — multiple style rules can apply to one element; the browser resolves conflicts using specificity and order.
Style — defines the visual appearance of elements.
Sheets — styles are stored in files (stylesheets) separate from HTML.

How does CSS work?

CSS works by selecting HTML elements and applying declarations (property–value pairs) to them. Here is the basic syntax:

style.css

/* selector { property: value; } */

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

p {
  font-size: 1rem;
  color: #888896;
  line-height: 1.7;
}

In the example above, h1 and p are selectors, color and font-size are properties, and the values after the colon are what gets applied.

What is CSS used for?

CSS handles virtually everything visual on a web page:

🎨 Colors & typography — text colour, font family, font size, line height
📐 Layout — Flexbox, Grid, positioning, alignment
📱 Responsive design — media queries that adapt the layout to any screen
✨ Animations & transitions — smooth hover effects, keyframe animations
🌙 Theming — dark mode, custom colour schemes via CSS variables

📌 Real-world fact

Every modern website uses CSS — YouTube, Google, Amazon, Instagram, Netflix. It powers every button, card, colour, and animation you see.

What is the difference between HTML and CSS?

This is one of the most common beginner questions:

HTML defines what is on the page — headings, paragraphs, images, links.
CSS defines how it looks — size, colour, spacing, layout.

index.html

<!-- HTML: structure -->
<h1 class="title">Hello, World!</h1>
<p>This is a paragraph.</p>

style.css

/* CSS: presentation */
.title {
  color: navy;
  font-size: 2.5rem;
}

p {
  color: #555;
  max-width: 600px;
}

Three ways to add CSS to a page

1. External stylesheet (recommended)

CSS lives in a separate .css file linked with a <link> tag. This is the standard approach for real projects.

index.html

<link rel="stylesheet" href="style.css">

2. Internal (embedded) CSS

CSS is placed inside a <style> tag in the <head>. Useful for single-page demos.

3. Inline CSS

CSS is written directly on an element using the style attribute. Avoid for anything beyond quick tests.

⚠️ Best practice

Always prefer external stylesheets for real projects. They keep code clean, are reusable across pages, and are cached by browsers for faster load times.

A brief history of CSS

1994 — Håkon Wium Lie proposes CSS.
1996 — CSS 1 becomes a W3C recommendation.
1998 — CSS 2 adds positioning and media types.
2011–now — CSS 3 splits into modules: Flexbox, Grid, Animations, Custom Properties, Container Queries, and more.

Summary

CSS is the language that makes the web beautiful. It selects HTML elements and applies visual styles — colours, fonts, layouts, animations. Without it, the web would be nothing but black text on a white background.

Ready to master it? Our full CSS course covers everything from selectors and the box model through Flexbox, Grid, animations, and modern CSS features — completely free.