CSS Fundamentals
designing

CSS Fundamentals for Beginners – Style Websites Like a Pro

Admin Admin
Overview
Curriculum
  • 17 Sections
  • 72 Lessons
Collapse All
Introduction to CSS
4 Lessons
  1. What is CSS?
  2. How CSS Works
  3. Why Use CSS?
  4. Ways to Apply CSS (Inline, Internal, External)
CSS Syntax & Selectors
5 Lessons
  1. CSS Syntax: Selectors, Properties & Values
  2. Simple Selectors (element, class, id)
  3. Grouping, Descendant & Child Selectors
  4. Attribute Selectors
  5. Pseudo-classes & Pseudo-elements
Colors, Backgrounds & Borders
4 Lessons
  1. Color Units (Named, HEX, RGB, RGBA, HSL)
  2. Background Properties
  3. Border Properties
  4. Box Shorthand & Border Images
Box Model, Spacing & Layout Basics
7 Lessons
  1. The Box Model: Content, Padding, Border, Margin
  2. Width & Height
  3. Box Sizing
  4. Overflow & Visibility
  5. Display Property block, inline, inline-block, none
  6. Positioning static, relative, absolute, fixed, sticky
  7. Z-index
Text, Fonts & Typography
5 Lessons
  1. Font Properties font-family, font-size, font-weight, font-style
  2. Text Color, Alignment & Decoration
  3. Line Height & Letter Spacing
  4. Text Shadow
  5. Word Wrapping, White Space
Lists, Links & Navigation Styling
3 Lessons
  1. Styling Lists list-style, list-style-type
  2. Link States link, visited, hover, active
  3. Pseudo-classes for Navigation hover, focus
Display, Visibility & Overflow
4 Lessons
  1. Visibility Property
  2. Opacity
  3. Overflow & Scrollbars
  4. Clip & Clip Path (optional advanced concept)
Flexbox Layout
4 Lessons
  1. Introduction to Flexbox
  2. display: flex & Flex Container Properties
  3. Flex Items & Their Properties
  4. Alignment & Justification
CSS Grid
5 Lessons
  1. Introduction to CSS Grid
  2. Grid Container Properties
  3. Grid Item Properties
  4. Grid Template Areas, Columns & Rows
  5. Auto Grid & Implicit Tracks
Responsive Design & Media Queries
4 Lessons
  1. What is Responsive Design?
  2. The @media Rule & Breakpoints
  3. Flexible Units %, vh, vw, rem, em
  4. Mobile-First & Desktop-First Approaches
CSS Transitions, Animations & Transformations
4 Lessons
  1. CSS Transitions transition properties
  2. CSS Transforms scale, rotate, translate, skew
  3. CSS Animations @keyframes, animation properties
  4. Animation Timing Functions & Delay
Shadows, Gradients & Advanced Styling
4 Lessons
  1. Box Shadow & Text Shadow
  2. CSS Gradients linear, radial
  3. Multiple Backgrounds
  4. Filter Effects blur, brightness, contrast
CSS Variables & Custom Properties
4 Lessons
  1. Defining CSS Variables --var-name
  2. Using var
  3. Variable Scope & Inheritance
  4. Fallback Values
CSS Functions & Calculations
3 Lessons
  1. The calc Function
  2. clamp, min, max
  3. Color Functions e.g., hsl, rgba
CSS Specificity, Cascade & Inheritance
4 Lessons
  1. How CSS Cascade Works
  2. Specificity Rules
  3. Inheritance of Properties
  4. !important and When (or Not) to Use It
CSS Layout Techniques & Best Practices
4 Lessons
  1. Float & Clear (older layouts)
  2. CSS Positioning (revisited)
  3. Modern Layouts with Flex + Grid
  4. Avoiding Common Pitfalls
CSS in Practice: Examples & Projects
4 Lessons
  1. Complete Stylesheet Example
  2. Styling a Web Page (Header, Navigation, Content, Footer)
  3. Responsive Web Page Example
  4. Mini-Projects & Exercises

Learn the core principles of CSS — the language that makes websites look beautiful. This beginner-friendly course walks you through colors, typography, layouts, flexbox, and responsive design. You’ll practice styling real web pages step-by-step and gain the skills to create visually appealing, modern websites — no prior experience required!

Deleting Course Review

Are you sure? You can't restore this back

Course Access

This course is password protected. To access it please enter your password below:

Related Courses

Placeholder
designing

React for Beginners – Build Dynamic Web Apps from Scratch

15
Start Course
designing

WordPress for Beginners – Build Your Own Website with Ease

17
Start Course
bootstrap-course
designing

Master Bootstrap – Build Modern, Responsive Websites Fast

56
Start Course
Scroll to top