1. مفهوم فریم‌ورک

• فریم‌ورک مجموعه‌ای از کدها و ابزارهاست که به برنامه‌نویس کمک می‌کند سریع‌تر و استانداردتر پروژه‌ها را بسازد.
• Bootstrap یک فریم‌ورک CSS و JS است که برای طراحی رابط کاربری ریسپانسیو و واکنش‌گرا استفاده می‌شود.
• هدف اصلی: کاهش نوشتن کدهای تکراری و ایجاد ظاهر یکپارچه در سایت.

2. بررسی Layout

• Layout ساختار و چیدمان صفحات وب است.
• Bootstrap 4 از سیستم Grid 12 ستونه استفاده می‌کند که با کلاس‌هایی مثل container, row, col صفحات را طراحی می‌کنیم.
• ویژگی ریسپانسیو: می‌توان عرض ستون‌ها را برای دستگاه‌های مختلف تنظیم کرد (col-sm-, col-md-, col-lg-, col-xl-).

3. بررسی Content

• Content شامل محتوای داخل صفحات است: متن، تصاویر، ویدیو و …
• Bootstrap 4 ابزارهایی برای استایل دادن به متن، تصاویر و لیست‌ها دارد.
• مثال: کلاس‌های text-center, img-fluid, lead و …

4. بررسی Component

• Components بخش‌های آماده و قابل استفاده در صفحات هستند.
• مثال‌ها: دکمه‌ها (buttons), نوار ناوبری (navbar), فرم‌ها, کاروسل (carousel).
• هر کامپوننت قابل استایل‌دهی و شخصی‌سازی با کلاس‌ها و JS است.

5. بررسی Utility

• Utility classes کلاس‌های کوتاه و کاربردی برای استایل‌دهی سریع هستند.
• مثال‌ها: فاصله‌ها (m-3, p-2)، رنگ‌ها (text-primary, bg-dark)، مخفی/نمایش (d-none, d-block)
• این کلاس‌ها کمک می‌کنند بدون نوشتن CSS اضافی، ظاهر عناصر را تغییر دهیم.

6. سایر نکات

• Bootstrap 4 شامل CSS, JS, jQuery است.
• از نسخه 4، Flexbox برای سیستم Grid استفاده شده است.
• قابلیت ریسپانسیو و آماده برای موبایل اولین اولویت طراحی است.