CSS گرید-تیمپل-کولمن پروپری

تعریف و استعمال

grid-template-columns کی خاصیت، گرید لائائٹ میں ستونوں کی تعداد (اور قطر) کا مقرر کرتی ہے.

یہ مقادیر، فضائیں سے علیحدہ کی گئی لیست ہیں، جس میں ہر مقادیر، اس کے مربوط ستون کی انداز بندی کا ذکر کرتا ہے.

چار ستون والا گرید کانٹینر بنائیں:

.grid-container {
  display: grid;
  grid-template-columns: auto auto auto auto;
}

ایک چار ستون والی گرید لائائٹ بنائیں، اور ہر ستون کی انداز بندی مقرر کریں:

.grid-container {
  display: grid;
  grid-template-columns: 30px 200px auto 100px;
}

grid-template-columns: none|auto|max-content|min-content|length|initial|inherit;

مقدار	وصف
none	مقصد: اس کا مقصد، ضرورت کے مطابق ستون بنانا ہے.
auto	ستون کی انداز بندی، کانٹینر کی انداز بندی اور ستون میں آئٹم کی انداز بندی پر منحصر ہوتی ہے.
max-content	ستونوں میں سب سے بڑی آئٹم کی بنیاد پر ہر ستون کی انداز بندی کرتا ہے.
min-content	ستونوں میں سب سے چھوٹی آئٹم کی بنیاد پر ہر ستون کی انداز بندی کرتا ہے.
length	کوئی بھی قانونی طول کی اکائی استعمال کرکے ستونوں کی انداز بندی کرتا ہے. ملاحظہ کریں:طول کی اکائیاں。
initial	اس کی پیدائش کا حصہ اس کی مقصدی مقدار پر قائم کرتا ہے. ملاحظہ کریں: initial。
inherit	اس کی پیدائش کا حصہ اس کی والد عنصر سے وارث کرتا ہے. ملاحظہ کریں: inherit。

مقصد:	none
وارثیت:	نہیں
آنیماشن کا تعمیر:	پشتیبانی کی، ملاحظہ کریں:آنیماشن سے متعلق اپریشن。
ورژن:	CSS Grid Layout Module Level 1
جسمانی زبان:	object.style.gridTemplateColumns="50px 50px 50px"

جداول میں کچھ نمبر، پورا اپنے اپنے حصے کو اس کی پہلی براہ راست بروئزر کی نسخہ کا ذکر کرتا ہے。

چروم	IE / ایج	فایرفاکس	سافاری	اوپرا
57	16	52	10	44