Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

LinkedIn Learning

CSS Essential Training

via LinkedIn Learning

Write review
Boot.dev Ad

Learn Backend Development Part-Time, Online

Learn More → Coursera Ad

AI, Data Science & Cloud Certificates from Google, IBM & Meta

Learn More →

Overview

Build a Learning Habit
Download Class Central's free printable study calendar
Download for Free
Explore the concepts that form the foundation of CSS. Learn how to select content, style text, manage layouts, and more as you work on a real-world project.

Syllabus

Introduction
  • Styling documents consistently
  • What you should know
  • Tools and sample projects
1. Getting Started
  • HTML and CSS
  • Browser developer tools
  • Referencing CSS
  • Project overview and setup
  • Optimizing images and retina displays
  • Project: Relative paths
  • Absolute paths
2. Core Concepts
  • CSS specifications and the W3C
  • CSS syntax and terminology
  • CSS values and units
  • The color and property values
  • Type and universal selectors
  • Class and ID selectors
  • Class and ID selector exercise
  • Descendant selectors
  • Grouping selectors
  • Inheritance and specificity
  • The cascade and importance
  • Project: Adding colors
  • Pseudo-class selectors and links
  • Project: Styling links
3. The Box Model
  • Introduction to the box model
  • Inline, block, and display
  • The box model properties
  • The box properties syntax and usage
  • Debugging the box model
  • Padding, margin, and border
  • Margin and layouts
  • Project: Adding content wrappers
  • Project: Margin and padding
4. Typography
  • Typography for the web
  • Changing the font-family
  • Font-weight and font-style
  • Web fonts with @font-face
  • Web fonts with Google Fonts
  • Project: Google Fonts
  • The font-size property
  • Font shorthand
  • Text-decoration, text-align, and line-height
  • Project: Typography styles
5. Layouts: Float and Position
  • Introduction to float
  • The float and clear properties
  • Float and collapsed container
  • Layouts and the box model
  • Project: Float and box model fix
  • Position
  • Position and z-index
6. Layouts: Flexbox and Grid
  • Introduction to Grid and Flexbox
  • Introduction to Flexbox
  • Flexbox: Orientation and ordering
  • Flexible sizing
  • Flexbox exercise
  • Flexbox: Alignment
  • Project: Flexbox alignment
  • Introduction to CSS Grid
  • The explicit grid
  • The implicit grid
  • Grid placement properties
  • Project: Grid columns and Firefox Grid Inspector
7. Advanced Selectors
  • Introduction to advanced selectors
  • Relational selectors: Combinators
  • Project: Updates with combinators
  • Pseudo-class selectors: First and last
  • Project: Advanced selectors
8. Fluid and Responsive Layouts
  • Introduction to responsive design
  • Project: Creating fluid layouts
  • Flexible background images
  • Project: Flexible background image
  • Introduction to media queries
  • Media queries, widths, and breakpoints
  • Testing responsive layouts
  • Project: Media queries and responsive layout
Conclusion
  • Next steps

Taught by

Christina Truong

Reviews

5.0 rating, based on 1 Class Central review

4.7 rating at LinkedIn Learning based on 3699 ratings

Start your review of CSS Essential Training

  • Trevour
    t's good for an absolute beginner, though I'm pretty sure it's better practice to write CSS in a separate file and then link it to HTML than write CSS directly into the HTML file. But for a beginner, that's good enough I guess

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.