CSS গ্রিড-অটো-ফ্লো এট্রিবিউট
- পূর্ববর্তী পৃষ্ঠা grid-auto-columns
- পরবর্তী পৃষ্ঠা grid-auto-rows
সংজ্ঞা ও ব্যবহার
grid-auto-flow বৈশিষ্ট্য গ্রিডে স্থাপন করা হওয়া বস্তুকে কিভাবে স্থাপন করা হবে তা নিয়ে নিয়ন্ত্রণ করে।
অন্যান্য দেখুন:
CSS শিক্ষাদীক্ষা:CSS গ্রিড লেআউট
উদাহরণ
উদাহরণ 1
স্বয়ংক্রিয়ভাবে প্রত্যেক স্তম্ভে স্থাপন করা হওয়া বস্তুকে স্থাপন করুন:
.grid-container {
display: grid;
grid-auto-flow: column;
}
উদাহরণ 2
গ্রিডের সমস্ত খালি অংশকে পূর্ণ করতে "dense" মান যোগ করুন:
.grid-container {
display: grid;
grid-auto-flow: row dense;
}
CSS সংজ্ঞান
grid-auto-flow: row|column|dense|row dense|column dense;
বৈশিষ্ট্য মান
| মান | বর্ণনা |
|---|---|
| row | ডিফল্ট মান। প্রত্যেক হাইটে বস্তুকে স্থাপন করুন。 |
| column | প্রত্যেক স্তম্ভ পূর্ণ করে বস্তুকে স্থাপন করুন。 |
| dense | গ্রিডের অংশবিশেষকে পূর্ণ করতে বস্তুকে স্থাপন করুন。 |
| row dense | প্রত্যেক হাইটে বস্তুকে স্থাপন করুন এবং গ্রিডের অংশবিশেষকে পূর্ণ করুন。 |
| column dense | প্রত্যেক স্তম্ভ পূর্ণ করে বস্তুকে স্থাপন করুন এবং গ্রিডের অংশবিশেষকে পূর্ণ করুন。 |
প্রযুক্তিগত বিবরণ
| ডিফল্ট মান: | row |
|---|---|
| উত্তরণ: | না |
| অ্যানিমেশন নির্মাণ: | সমর্থন করা হয়। দেখুন:অ্যানিমেশন-সংক্রান্ত বৈশিষ্ট্য。 |
| সংস্করণ: | CSS Grid Layout Module Level 1 |
| JavaScript সংজ্ঞান: | object.style.gridAutoFlow="row dense" |
ব্রাউজার সমর্থন
তালিকায় সম্পূর্ণভাবে এই বৈশিষ্ট্যকে সমর্থনকারী প্রথম ব্রাউজারের সংস্করণ নম্বর উল্লেখ করা হয়েছে。
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 57 | 16 | 52 | 10 | 44 |
- পূর্ববর্তী পৃষ্ঠা grid-auto-columns
- পরবর্তী পৃষ্ঠা grid-auto-rows
