🧩 Level: Beginner | Topic: CSS Basics & Box Model

💡 Overview

In this project, you’ll take your Gift Ideas HTML page from Assignment 1 and make it look visually appealing by applying CSS styling.

By the end of this assignment, you’ll learn:

• How to link an external CSS file to your HTML page
• How to use element selectors to target content
• How to apply basic CSS properties like colors, fonts, and text alignment
• How to use padding, margin, and borders to organize content (Box Model basics)
• Confidence to enhance your own HTML projects with styling

🧠 Prerequisites

✅ Must Know

• Basic HTML from Assignment 1: headings, paragraphs, lists, links, images, and <div> containers

• Linking CSS: How to connect an external CSS file to your HTML using <link rel="stylesheet" href="style.css">

  Learn from 👉 MDN – Linking CSS

• CSS Selectors:

  • Element selectors (body, h1, p) Learn from 👉 MDN – CSS Selectors

• Basic CSS Properties:

  color, background-color, font-family, text-align

• Box Model Basics:

  • padding, margin, border, border-radius

    Learn from 👉 MDN – The Box Model

⚙️ Good to Have

• Basic Linux terminal commands (cd, mkdir, ls, touch) to create and organize project files

  Resources:

  • Learn from 👉 The Odin Project – Command Line Basics

• Basic Git & GitHub knowledge to track and save your project

  • git init, git add, git commit
  • Creating + pushing to a GitHub repository

  Resources:

  • Setting up Git - Learn from 👉 The Odin Project - Setting Up Git
  • Intro to Git - Learn from 👉 The Odin Project- Introduction to Git
  • Git Basics - Learn from 👉 The Odin Project - Git Basics