CSS Fundamentals

This section introduces students to the fundamentals of CSS (Cascading Style Sheets) — the language used to style and design web pages.
The main goal is to build a strong foundation by understanding how CSS connects with HTML and how simple styling rules control the appearance of web elements.

Rather than overwhelming students with advanced layout techniques, this section focuses strictly on the core building blocks that every front-end developer must master first.

What Students Will Learn

1️⃣ What is CSS?

• The role of CSS in web development

• How CSS works alongside HTML

• Types of CSS: inline, internal, and external

• Basic CSS syntax (selector → property → value)

2️⃣ Basic Selectors

• Element selectors (p, div, h1)

• Class selectors (.container)

• ID selectors (#header)

• Grouping selectors

• Simple descendant selectors

3️⃣ Cascade & Specificity (Intro Level)

• How browsers decide which style to apply

• Order of importance (inline, internal, external)

• Basic understanding of CSS specificity

4️⃣ Basic Styling Properties

• Colors (color, background-color)

• Text styling (font-size, text-align)

• Width and height

• Margin and padding (basic spacing concepts)

Learning Outcomes

By the end of this section, students will be able to:

• Understand how CSS rules are written

• Apply styles correctly to HTML elements

• Use class and ID selectors effectively

• Control basic colors, text, and spacing

• Understand how CSS styles override each other