CSS grid-template-columns অপারেশন

বিবরণ ও ব্যবহার

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
JavaScript গঠনশৈলী:	object.style.gridTemplateColumns="50px 50px 50px"

টেবিলের সংখ্যা থেকে এই প্রতিশ্রুতি দেওয়া হয় যে, এই অ্যাট্রিবিউটটির প্রথম সমর্থনকারী ব্রাউজারের সংস্করণ。

Chrome	IE / Edge	Firefox	Safari	Opera
57	16	52	10	44