বুটষ্ট্ৰেপ গ্ৰীডৰ উদাহৰণসমূহ
বুটষ্ট্ৰেপ গ্ৰীড ব্যৱস্থাপ্ৰণালীৰ ভিতৰত নিৰ্মাণৰ সৈতে আপোনাক পৰিচিত কৰিবলে মূল গ্ৰীড পৰিকল্পনাসমূহ ।
এই উদাহৰণসমূহত .themed-grid-colকিছু থিমিং যোগ কৰিবলৈ স্তম্ভসমূহত শ্ৰেণীটো যোগ কৰা হয়। এইটো এটা শ্ৰেণী নহয় যি অবিকল্পিতভাৱে Bootstrap ত উপলব্ধ ।
পাঁচটা গ্ৰীড টায়াৰ
বুটষ্ট্ৰেপ গ্ৰীড ব্যৱস্থাপ্ৰণালীৰ পাঁচটা স্তৰ আছে, আমি সমৰ্থন কৰা প্ৰতিটো ডিভাইচৰ পৰিসীমাৰ বাবে এটা । প্ৰতিটো স্তৰ এটা নূন্যতম দৰ্শনপৰ্ট আকাৰত আৰম্ভ হয় আৰু অভাৰৰাইড নকৰালৈকে বৃহৎ ডিভাইচসমূহত স্বয়ংক্ৰিয়ভাৱে প্ৰযোজ্য হয়।
তিনিটা সমান স্তম্ভ
ডেস্কটপসমূহৰ পৰা আৰম্ভ কৰি আৰু ডাঙৰ ডেস্কটপসমূহলে স্কেলিং কৰা তিনিটা সমান-প্ৰস্থৰ স্তম্ভ লাভ কৰক । মোবাইল ডিভাইচ, টেবলেট আৰু তলত কলামবোৰ স্বয়ংক্ৰিয়ভাৱে ষ্টেক হ’ব।
তিনিটা সমান স্তম্ভ বিকল্প
ক্লাছসমূহ ব্যৱহাৰ কৰি .row-cols-*আপুনি সহজে সমান স্তম্ভৰ সৈতে এটা গ্ৰীড সৃষ্টি কৰিব পাৰে।
.colসন্তানৰ
.row-cols-md-3
.colসন্তানৰ
.row-cols-md-3
.colসন্তানৰ
.row-cols-md-3
তিনিটা অসমান স্তম্ভ
ডেস্কটপসমূহৰ পৰা আৰম্ভ কৰি বিভিন্ন প্ৰস্থৰ ডাঙৰ ডেস্কটপসমূহলৈ স্কেলিং কৰা তিনিটা স্তম্ভ লাভ কৰক । মনত ৰাখিব, এটা অনুভূমিক ব্লকৰ বাবে গ্ৰীড স্তম্ভসমূহে বাৰটালৈকে যোগ কৰিব লাগে। ইয়াতকৈ অধিক, আৰু স্তম্ভসমূহে ভিউপৰ্ট যিয়েই নহওক কিয় ষ্টেক কৰিবলৈ আৰম্ভ কৰে।
দুটা স্তম্ভ
ডেস্কটপসমূহৰ পৰা আৰম্ভ কৰি আৰু ডাঙৰ ডেস্কটপসমূহলে স্কেলিং কৰা দুটা স্তম্ভ লাভ কৰক ।
সম্পূৰ্ণ প্ৰস্থ, একক স্তম্ভ
সম্পূৰ্ণ প্ৰস্থৰ উপাদানসমূহৰ বাবে কোনো গ্ৰীড শ্ৰেণীৰ প্ৰয়োজন নাই।
দুটা নেষ্টেড স্তম্ভ থকা দুটা স্তম্ভ
নথিপত্ৰ অনুসৰি, নেষ্টিং সহজ—মাত্ৰ এটা বৰ্তমানৰ স্তম্ভৰ ভিতৰত স্তম্ভৰ এটা শাৰী ৰাখক। ই আপোনাক ডেস্কটপসমূহৰ পৰা আৰম্ভ কৰি ডাঙৰ ডেস্কটপসমূহলে স্কেলিং কৰা দুটা স্তম্ভ দিয়ে , ডাঙৰ স্তম্ভৰ ভিতৰত আন দুটা (সমান প্ৰস্থ)ৰ সৈতে।
মোবাইল ডিভাইচৰ আকাৰ, টেবলেট আৰু তলত, এই স্তম্ভসমূহ আৰু ইয়াৰ নেষ্টেড স্তম্ভসমূহ ষ্টেক হ’ব।
মিশ্ৰিত: মোবাইল আৰু ডেস্কটপ
বুটষ্ট্ৰেপ v4 গ্ৰীড ব্যৱস্থাপ্ৰণালীৰ পাঁচটা স্তৰৰ শ্ৰেণী আছে: xs (অতিৰিক্ত সৰু, এই শ্ৰেণী ইনফিক্স ব্যৱহাৰ কৰা হোৱা নাই), sm (সৰু), md (মধ্যমীয়া), lg (বৃহৎ), আৰু xl (অতিৰিক্ত ডাঙৰ) । আপুনি এই শ্ৰেণীসমূহৰ প্ৰায় যিকোনো সংমিশ্ৰণ ব্যৱহাৰ কৰিব পাৰে অধিক গতিশীল আৰু নমনীয় পৰিকল্পনা সৃষ্টি কৰিবলে।
শ্ৰেণীসমূহৰ প্ৰতিটো স্তৰ স্কেল আপ হয়, অৰ্থাৎ যদি আপুনি md, lg আৰু xl ৰ বাবে একে প্ৰস্থ সংহতি কৰাৰ পৰিকল্পনা কৰিছে, আপুনি কেৱল md ধাৰ্য্য কৰিব লাগিব ।
মিশ্ৰিত: মোবাইল, টেবলেট, আৰু ডেস্কটপ
নালা
ক্লাছৰ সৈতে .gx-*অনুভূমিক নালাবোৰ সামঞ্জস্য কৰিব পাৰি।
.col.gx-4নালাৰ
সৈতে
.col.gx-4নালাৰ
সৈতে
.col.gx-4নালাৰ
সৈতে
.col.gx-4নালাৰ
সৈতে
.col.gx-4নালাৰ
সৈতে
.col.gx-4নালাৰ
সৈতে
.gy-*উলম্ব নালাবোৰ নিয়ন্ত্ৰণ কৰিবলৈ শ্ৰেণীসমূহ ব্যৱহাৰ কৰক ।
.col.gy-4নালাৰ
সৈতে
.col.gy-4নালাৰ
সৈতে
.col.gy-4নালাৰ
সৈতে
.col.gy-4নালাৰ
সৈতে
.col.gy-4নালাৰ
সৈতে
.col.gy-4নালাৰ
সৈতে
ক্লাছৰ সৈতে .g-*দুয়ো দিশৰ নালাবোৰ সামঞ্জস্য কৰিব পাৰি।
.col.g-3নালাৰ
সৈতে
.col.g-3নালাৰ
সৈতে
.col.g-3নালাৰ
সৈতে
.col.g-3নালাৰ
সৈতে
.col.g-3নালাৰ
সৈতে
.col.g-3নালাৰ
সৈতে
পাত্ৰসমূহ
Bootstrap v4.4 ত যোগ কৰা অতিৰিক্ত শ্ৰেণীসমূহে এটা নিৰ্দিষ্ট ব্ৰেকপইন্টলৈকে 100% বহল ধাৰকসমূহৰ অনুমতি দিয়ে। v5 এ এটা নতুন xxlব্ৰেকপইন্ট যোগ কৰে।