বুটস্ট্র্যাপ গ্রিড সিস্টেমের মধ্যে বিল্ডিংয়ের সাথে আপনাকে পরিচিত করতে প্রাথমিক গ্রিড লেআউট।
এই উদাহরণগুলিতে .themed-grid-colকিছু থিমিং যোগ করার জন্য কলামগুলিতে ক্লাস যুক্ত করা হয়েছে। এটি এমন একটি ক্লাস নয় যা ডিফল্টরূপে বুটস্ট্র্যাপে উপলব্ধ।
বুটস্ট্র্যাপ গ্রিড সিস্টেমে পাঁচটি স্তর রয়েছে, আমরা সমর্থন করি এমন প্রতিটি ডিভাইসের জন্য একটি। প্রতিটি স্তর একটি ন্যূনতম ভিউপোর্ট আকারে শুরু হয় এবং স্বয়ংক্রিয়ভাবে বড় ডিভাইসগুলিতে প্রযোজ্য হয় যদি না ওভাররাইড করা হয়৷
ডেস্কটপ থেকে শুরু করে এবং বড় ডেস্কটপে স্কেলিং করে তিনটি সমান-প্রস্থের কলাম পান । মোবাইল ডিভাইস, ট্যাবলেট এবং নীচে, কলামগুলি স্বয়ংক্রিয়ভাবে স্ট্যাক হবে৷
ডেস্কটপ থেকে শুরু করে তিনটি কলাম পান এবং বিভিন্ন প্রস্থের বড় ডেস্কটপে স্কেলিং করুন । মনে রাখবেন, গ্রিড কলাম একটি একক অনুভূমিক ব্লকের জন্য বারোটি পর্যন্ত যোগ করা উচিত। এর থেকেও বেশি, এবং কলামগুলি ভিউপোর্ট যাই হোক না কেন স্ট্যাক করা শুরু করে।
ডেস্কটপ থেকে শুরু করে বড় ডেস্কটপে স্কেলিং করে দুটি কলাম পান ।
পূর্ণ-প্রস্থ উপাদানগুলির জন্য কোনও গ্রিড ক্লাসের প্রয়োজন নেই।
ডকুমেন্টেশন অনুযায়ী, নেস্টিং করা সহজ—একটি বিদ্যমান কলামের মধ্যে শুধু কলামের সারি রাখুন। এটি আপনাকে ডেস্কটপ থেকে শুরু করে দুটি কলাম দেয় এবং বড় ডেস্কটপে স্কেলিং করে , বড় কলামের মধ্যে আরও দুটি (সমান প্রস্থ)।
মোবাইল ডিভাইসের আকার, ট্যাবলেট এবং নিচে, এই কলামগুলি এবং তাদের নেস্টেড কলামগুলি স্ট্যাক হবে৷
বুটস্ট্র্যাপ v4 গ্রিড সিস্টেমে ক্লাসের পাঁচটি স্তর রয়েছে: xs (অতিরিক্ত ছোট), sm (ছোট), md (মাঝারি), lg (বড়), এবং xl (অতিরিক্ত বড়)। আপনি আরও গতিশীল এবং নমনীয় লেআউট তৈরি করতে এই শ্রেণীর প্রায় যেকোনো সমন্বয় ব্যবহার করতে পারেন।
ক্লাসের প্রতিটি স্তর স্কেল করে, মানে আপনি যদি xs এবং sm-এর জন্য একই প্রস্থ সেট করার পরিকল্পনা করেন, তাহলে আপনাকে শুধুমাত্র xs নির্দিষ্ট করতে হবে।