What is Bootstrap?

Bootstrap is a CSS framework that provides pre-built classes for:

• Responsive layouts
• Styling
• Components
• Faster UI development

Include Bootstrap:

<link
  href="<https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css>"
  rel="stylesheet"
/>

Bootstrap Grid System

Basic concept: 12-column grid system

Structure:

container
 ├── row
 │    ├── col
 │    └── col
 └── row
      ├── col
      └── col

Example:

<div class="container">
  <div class="row">
    <div class="col-xl-6"></div>
    <div class="col-xl-6"></div>
  </div>
</div>

Notes:

• container → wrapper
• row → horizontal section
• col → column
• col-xl-6 → 6/12 columns (50%)