ساختار پایه ی یک سیستم شبکه بندی بوت استرپ

ساختار کلی استفاده از بوت استرپ به صورت زیر است؛ به این ساختار دقت کنید:

<div class="row">
  <div class="col-*-*"></div>
</div>
<div class="row">
  <div class="col-*-*"></div>
  <div class="col-*-*"></div>
  <div class="col-*-*"></div>
</div>
<div class="row">
  ...
</div>

در بوت استرپ، برای قرار دادن محتوا و عناصر، ابتدا باید با استفاده از کلاس row یک ردیف ایجاد کنیم. وقتی که ردیف ایجاد شد، باید این ردیف را با استفاده از کلاس های شبکه بندی، به یک یا چند ستون تقسیم کنیم. برای ایجاد یک ستون، کافی است از کلاس col استفاده کنیم و به دنبال آن، نوع کلاس شبکه بندی را قرار دهیم و سپس در ادامه ی آن با استفاده از یک عدد، میزان پهنای آن ستون را مشخص کنیم. برای متوجه شدن این موضوع به مثال های زیر دقت کنید.

نکته: توجه کنید که به جای ستاره ها(*) باید از نام کلاس های شبکه بندی و اندازه ی آنها، استفاده کنید.