Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
CSS Grid Course (2022)
Rating: 4.4 out of 5(30 ratings)
3,247 students

CSS Grid Course (2022)

All you need about Grid
Created byEnes Karakaş
Last updated 9/2022
English
English [Auto],

What you'll learn

  • CSS Grid Everything about it
  • How actually Layout Works
  • You will able to build your website or project!
  • All CSS Grid Properties with Examples

Course content

1 section • 6 lectures • 1h 53m total length

  • Introduction1:21

    Learn CSS layout properties step by step, practice with two projects, and master controlling layouts—while using articles to visualize concepts and reinforce hands-on building.

  • Grid Overview8:01
  • Grid All Properties58:34

    Explore how CSS grid creates explicit and implicit rows and columns, control line numbering and gaps, and use grid templates areas to craft responsive layouts.

  • Project 111:46

    Learn to build a responsive CSS grid layout for a hero section and image gallery, toggle start and finish states, and master grid columns and background images.

  • Project 233:37

    build a responsive layout using css grid and flexbox, employing grid template areas for header, products, offers, and footer, with media queries to adapt to smaller screens.

  • THE END0:19

    Concludes a CSS grid course with two practice projects to learn and apply the concepts, and invites viewers to like, subscribe, and share the videos.

Requirements

  • Basic HTML knowledge
  • Basic CSS knowledge
  • Basic about how to use any IDE

Description

(WARNING ABOUT COURSE DESCRIPTION).  A course description on Udemy must contain at least 200 words. It's difficult to write, especially for a free course ( which cannot exceed 2H total video ). Due to some people not finding it professional, I had to explain this. I could explain what you can expect from the course in a few sentences, but as I mentioned it's not available. Feel free to skip reading the course description if you wish.


What you will learn?


  • Everything about Grid

  • You will learn how to use "All properties" with examples

  • Difference between Grid and Flexbox, which one you should prefer

  • You will be able to build your website or project!

  • You will learn how Layout Works

  • You will learn how responsive website designing


  • How does "display" work?

  • How does "grid template columns" work?

  • How does "grid template rows" work?

  • How does "grid template ares" work?

  • How does justify content work?

  • How does align content work?

  • How does justify items work?

  • How does align place items work?

  • How does grid auto columns work?

  • How does grid auto rows work?

  • How does grid auto flow work?

  • How does grid column start work?

  • How does grid column end work?

  • How does row column start work?

  • How does row column end work?

  • How does align self work?

  • How does justify self work?

  • How does grid area work?

  • Which properties are for grid container

  • Which properties are for grid item

  • We will build two different projects so that you can practice

  • Project one is smaller than project 2. You will learn how the layout works well by building, and practicing these projects.


What Are the requirements for this course?


  • Almost really nothing, except having basic HTML, CSS, and how to use IDE.



Who is this course for?

  • Anyone who wants to learn how the grid works

  • How the layout system works

  • Difference between Flexbox and Grid

  • Learn how to make your layout projects

Who this course is for:

  • Anyone who wants to learn how the grid works
  • How the layout system works
  • Difference between Flexbox and Grid
  • Learn how to make your layout projects

Report abuse