HTML & CSS - Mastery / CSS Basics

Ways to Add CSS (Inline, Internal, External)

↔️ Different ways to add CSS

When you want to style your HTML, you can add CSS in three main ways. Here’s how they work:

1️⃣ Inline CSS

  • Written directly inside the HTML tag

  • Good for quick, one-time styling

  • Not ideal for bigger projects

🟡 Use it only when you want to style one specific element quickly.

2️⃣ Internal CSS

  • CSS is written in a <style> tag

  • Goes inside the <head> section of your HTML file

  • Great for small pages or when testing styles

🟢 Handy when working with just one HTML file.

3️⃣ External CSS

  • Best practice for most real projects

  • You write your styles in a separate .css file

  • Link it to your HTML using <link> in the <head>

✅ Clean, reusable, and easier to manage when your project grows.

📌 Summary Table

Method

Where?

Best for

Inline

Inside an HTML element

Quick fixes (not recommended long-term)

Internal

<style> in <head>

Small or single-page sites

External

Linked .css file

Larger projects, best practice ✅