বুটস্ট্রাপ ৫

রেস্পন্সিভ ফিক্স উইড

<div class='container'>...</div>

ফুল উইড

<div class='container-fluid'>...</div>

সব কলাম উপরে দেখানো

<div class='row align-items-start'><div class='col'>...</div><div class='col'>...</div></div>

সব কলাম মাঝে দেখানো

<div class='row align-items-center'><div class='col'>...</div><div class='col'>...</div></div>

সব কলাম নিচে দেখানো

<div class='row align-items-end'><div class='col'>...</div><div class='col'>...</div></div>

একটি কলাম উপরে দেখানো

<div class='row'><div class='col align-self-start'>...</div></div>

একটি কলাম মাঝে দেখানো

<div class='row'><div class='col align-self-center'>...</div></div>

একটি কলাম নিচে দেখানো

<div class='row'><div class='col align-self-end'>...</div></div>

ডিসপ্লে ওয়ান

<h1 class='display-1'>Display 1</h1>

ডিসপ্লে টু

<h2 class='display-2'>Display 2</h2>

ডিসপ্লে থ্রি

<h3 class='display-3'>Display 3</h3>

ডিসপ্লে ফোর

<h4 class='display-4'>Display 4</h4>

ডিসপ্লে ফাইভ

<h5 class='display-5'>Display 5</h5>

ডিসপ্লে সিক্স

<h6 class='display-6'>Display 6</h6>

স্ক্রীন প্রস্থ যখন ৫৭৬পিক্সেল এর ছোট

<div class='col-'>...</div>

স্ক্রীন প্রস্থ যখন ৫৭৬পিক্সেল এর সমান বা বড়

<div class='col-sm'>...</div>

স্ক্রীন প্রস্থ যখন ৭৬৮পিক্সেল এর সমান বা বড়

<div class='col-md'>...</div>

স্ক্রীন প্রস্থ যখন ৯৯২পিক্সেল এর সমান বা বড়

<div class='col-lg'>...</div>

স্ক্রীন প্রস্থ যখন ১২০০পিক্সেল এর সমান বা বড়

<div class='col-xl'>...</div>

স্ক্রীন প্রস্থ যখন ১৪০০পিক্সেল এর সমান বা বড়

<div class='col-xxl'>...</div>

সব কলাম বামে দেখানো

<div class='row justify-content-start'><div class='col'>...</div><div class='col'>...</div></div>

সব কলাম মাঝে দেখানো

<div class='row justify-content-center'><div class='col'>...</div><div class='col'>...</div></div>

সব কলাম ডানে দেখানো

<div class='row justify-content-end'><div class='col'>...</div><div class='col'>...</div></div>

সব কলাম ডানে বামে সমান গ্যাপে দেখানো

<div class='row justify-content-around'><div class='col'>...</div></div>

সব কলাম এর মাঝে সমান গ্যাপে দেখানো

<div class='row justify-content-between'><div class='col'>...</div></div>

সব কলাম সমান গ্যাপে দেখানো

<div class='row justify-content-evenly'><div class='col'>...</div></div>

রাউন্ড কর্নার

<img class='rounded'>

বৃত্ত আকার

<img class='rounded-circle'>

লেফট অ্যালাইন

<img class='float-start'>

রাইট অ্যালাইন

<img class='float-end'>

সেন্টার অ্যালাইন

<img class='d-block mx-auto'>

রিস্পন্সিভ ইমেজ

<img class='img-fluid'>