نمونه کد

یک نمونه ساده از خاصیت grid-template-columns:

آزمایشگاه

تعریف و کاربرد

برای تعیین تعداد و عرض ستون ها در یک طرح بندی شبکه ای از خاصیت grid-template-columns استفاده می کنیم.

اطلاعات

# توضیحات
مقدار پیشفرض پیش فرض
ارث بری خیر
انیمیشن بله
نسخه CSS Grid Layout Module Level 1
نگارش JS object.style.gridTemplateColumns="50px 50px 50px"

سازگاری با مرورگر

# کروم ادج فایرفاکس سافاری اپرا
grid-template-columns

شیوه نگارش

مقادیر

مقادیر توضیحات
none پیش فرض
auto اندازه ستون ها را به صورت خودکار تعیین می کند.
max-content اندازه ستون ها را نسبت بر بزرگ ترین ستون موجود در آن صفحه حساب می کند.
min-content اندازه ستون ها را نسبت بر کوچک ترین ستون موجود در آن صفحه حساب می کند.
length اندازه ستون ها را نسبت بر طول قانونی تعیین شده در آن صفحه حساب می کند.
initial این مقدار را به ویژگی پیش فرض خود اضافه می کند.
inherit این مقدار را از تگ والد خود به ارث می برد.