YoVDO

Learn CSS Grid

Offered By: Scrimba

Tags

HTML & CSS Courses Web Development Courses Flexbox Courses Responsive Design Courses CSS Grid Courses

Course Description

Overview

This tutorial teaches you CSS Grid through 14 interactive screencasts. You'll learn all the key concepts while building three awesome layouts: a website, an image grid, and an article. Plus, you'll learn how to combine CSS Grid with Flexbox.
  • CSS Grid fundamentals
  • Starting with grid
  • Responsive grids
  • Fraction units
  • Repeat
  • Positioning items
  • Template areas
  • Auto-fit
  • minmax
  • Implicit rows
  • Named lines
  • justify-items
  • align-items
  • auto-fit vs auto-fill
  • Create an article layout
  • An awesome image grid

Syllabus

  • Learn CSS Grid
    • 1. Intro to the CSS Grid course
    • 2. Your first grid - CSS Grid tutorial
    • 3. Frontend Career Path
    • 4. Fraction units and repeat - CSS Grid tutorial
    • 5. Positioning items - CSS Grid tutorial
    • 6. Template areas - CSS Grid tutorial
    • 7. Auto-fit and minmax - CSS Grid tutorial
    • 8. Implicit rows - CSS Grid tutorial
    • 9. An awesome image grid - CSS Grid tutorial
    • 10. Named Lines - CSS Grid tutorial
    • 11. justify-content and align-content - CSS Grid tutorial
    • 12. justify-items and align-items - CSS Grid tutorial
    • 13. Auto-fit vs. auto-fill - CSS Grid tutorial
    • 14. Creating an article layout - CSS Grid tutorial
    • 15. Grid vs. Flexbox - CSS Grid tutorial
    • 16. Why are Solo Projects important?
    • 17. Solo Project (PRO) - BBC News Clone
    • 18. Congrats on completing the CSS Grid course!

Related Courses

Mobile Web Development
Google via Udacity
iDESWEB, Introducción al desarrollo web
Miríadax
Information Design
University of California, San Diego via Coursera
Advanced Styling with Responsive Design
University of Michigan via Coursera
Front-End Web UI Frameworks and Tools
The Hong Kong University of Science and Technology via Coursera