Why CSS

CSS (Cascading Style Sheets) is a language used to design and style web pages. It controls how HTML elements look — such as colors, fonts, spacing, layout, and responsiveness.

Think of it like this:

• HTML = structure (skeleton of a webpage)
• CSS = design (appearance and layout)
• JavaScript = behavior (interactions)

Concept: Start by explaining that while HTML is the "skeleton" or structure of a webpage, CSS (Cascading Style Sheets) is the "skin" or clothing that makes it look good.

Key Points to Cover:

• Definition: CSS stands for Cascading Style Sheets,.

• Purpose: It controls the visual appearance of HTML elements, including layout, colors, and fonts.

• Separation of Concerns: Explain why we don't just use HTML for style. CSS allows you to change the look of an entire website by editing just one file, keeping the HTML clean and structural,.

Student Exercise: Show a plain HTML list (e.g., "Eat, Sleep, Repeat") and then show how a few lines of CSS can turn it into a colorful, styled menu,.

Basic CSS Syntax

CSS works by selecting an HTML element and applying styles to it.

Example:

selector {
  property: value;
}

Example with HTML:

<h1>Hello World</h1>

h1 {
  color: blue;
  font-size: 40px;
}

This makes the heading blue and larger.