🎨 CSS Class 1 – Basics

1️⃣ What is CSS?

CSS (Cascading Style Sheets) is used to style HTML elements — change colors, fonts, layout, etc.

Example: Without CSS, the text looks plain. With CSS, you can make it beautiful!

This is styled text using CSS.


2️⃣ Ways to Apply CSS

✅ Inline CSS

This paragraph uses inline CSS.

✅ Internal CSS

This paragraph is styled using internal CSS written inside the <style> tag.

✅ External CSS

You can also write styles in a separate style.css file and link it using the <link> tag.


3️⃣ CSS Colors

Color by name: blue

Color by HEX: #ff6600

Color by RGB: rgb(0, 128, 0)

Color by RGBA: transparent red background


4️⃣ CSS Selectors

Universal Selector: applies to all elements using *

Element Selector: targets an element name like p, h1

Class Selector: uses a dot (.) — example: .highlight

ID Selector: uses a hash (#) — example: #unique

Grouping Selector: group multiple elements like h1, h2, p


🧪 Practice Exercise

Try editing this file and experiment with:


📚 Summary Table

Topic Description Example
Inline CSS CSS inside HTML tag <p style="color:red">
Internal CSS CSS inside <style> tag <style>p{color:red;}</style>
External CSS CSS in separate file <link rel="stylesheet">
Color Types name, hex, rgb, rgba color: blue; color: #ff0000;
Selectors element, class, id, universal p{}, .class{}, #id{}, *{}

✨ Practice and have fun styling! ✨