CSS Grid Layout

سرفصل های دوره

About this Course

CSS Grid Layout provides a built-in, more efficient way of designing grid-based layouts in the browser. It brings a new set of properties, functions and flexible units that let you control the exact placement and sizing of grid components.

What you'll learn

Declaring row and column tracks
Setting gutters between rows and columns
Creating flexible and responsive grid layouts without media queries
Using Grid with Flexbox

01. Introducing Grid Layout

1-Introducing-Grid-Layout.zip

01. Understanding Grid

02. Grid Concepts and Terminology

03. Defining a Grid

04. Setting Grid Rows

05. Add Gutters Between Rows and Columns

02. Flexible Sized Grids

01. Introducing fr, a Flexible CSS Length Unit

2-Flexible-Sized-Grids.zip

02. Set Tracks with repeat() Notation

03. Flexible Track Sizing with minmax()

04. Repeat Tracks with auto-fill and auto-fit

05. The Explicit and Implicit Grid

06. Control the Auto-placement of Grid Items

03. Going Further with Grid Layout

01. Firefox Grid Inspector Tool

02. Position Items by Grid Lines

3-Going-Further-With-Grid-Layout.zip

03. Negative Grid Lines and Shorthand Syntax

04. Placing Elements Using Grid Template Areas

05. Adjust the Grid with Media Queries

06. Using Grid with Flexbox

45,900 تومان

خرید اشتراک افزودن به سبد خرید

خرید دانلودی فوری

در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.

تولید کننده: Treehouse