3. Bootstrap Grid System
📘 কনসেপ্ট (থিওরি)
বুটস্ট্র্যাপের গ্রিড (grid) সিস্টেম পেজ জুড়ে ১২টি কলাম পর্যন্ত অনুমোদন করে।
আপনি যদি ১২টি কলাম আলাদাভাবে ব্যবহার করতে না চান, তবে আপনি আরও চওড়া কলাম তৈরি করতে কলামগুলোকে একসাথে গ্রুপ করতে পারেন।
গ্রিড সিস্টেমটি রেসপন্সিভ, এবং স্ক্রিনের মাপের ওপর নির্ভর করে কলামগুলো পুনরায় সাজানো হবে।
গ্রিড ক্লাসগুলো:
-
.col- (খুব ছোট ডিভাইস - স্ক্রিনের প্রস্থ 576px এর চেয়ে কম)
- .col-sm- (ছোট ডিভাইস - স্ক্রিনের প্রস্থ 576px এর সমান বা বেশি)
- .col-md- (মাঝারি ডিভাইস - স্ক্রিনের প্রস্থ 768px এর সমান বা বেশি)
- .col-lg- (বড় ডিভাইস - স্ক্রিনের প্রস্থ 992px এর সমান বা বেশি)💡 উদাহরণ
একটি সাধারণ গ্রিড স্ট্রাকচার:
Column 1
Column 2
Column 3
এটি ছোট এবং তার চেয়ে বড় ডিভাইসে সমান প্রস্থের তিনটি কলাম তৈরি করে।
🎯 আপনার কাজ (প্র্যাকটিস)
একটি
container div তৈরি করুন, এর ভেতরে একটি row div এবং তার ভেতরে মাঝারি (md) ডিভাইসের জন্য সমান প্রস্থের দুটি কলাম তৈরি করুন। প্রতিটি কলামে কিছু টেক্সট দিন।main.bootstrap
Loading...
OUTPUT