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

Overview

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

4.7 rating, based on 3 Class Central reviews

Start your review of CSS Essential Training

  • Very helpful!
    Christina helped In breaking down these basics with ease. I almost got carried away that I'm still a beginner and this is just the beginning part of my web development journey, lol.

    We need more people like her. I really appreciate her time and effort in bringing these all together in one piece. Gracias, Truong
  • Mohamed Yaser Farook M
    it is a good course but i didnt get the certificate what i need to do ..................the mendor is very very very good at teaching
  • Profile image for Sidhartha Mohanty
    Sidhartha Mohanty
    I am beginner to the course and it helped me a lot to get in touch with the essentials.
    Great explanatory and really enjoyed learning.

Never Stop Learning.

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

Someone learning on their laptop while sitting on the floor.