روز برنامه‌نویس مبارک 🤩🎉 از هدایای روز برنامه‌نویس جا نمونی ⌛
۰ ثانیه
۰ دقیقه
۰ ساعت
۰ امیر حق شناس
جلسه دوم - نصب و راه اندازی فریم ورک bootstrap 4 - مطالب
جامعه Html & CSS ایجاد شده در ۲۳ شهریور ۱۴۰۴

1. نصب بوتسترپ 4

  • Bootstrap 4 را می‌توان به چند روش نصب کرد:
    1. استفاده از CDN (ساده‌ترین روش):
      • اضافه کردن لینک CSS و JS مستقیم از سرورهای آنلاین.
      • مثال:

         

        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
        
    2. دانلود فایل‌ها و اضافه کردن محلی (Local):
      • دانلود از سایت رسمی Bootstrap و قرار دادن فایل‌ها در پروژه.
      • سپس لینک دادن به فایل‌های CSS و JS در پروژه.

2. مروری بر فایل‌های مورد نیاز

  • CSS اصلی: برای استایل‌دهی عناصر و کلاس‌ها.
  • JS + jQuery: برای کامپوننت‌های تعاملی مثل modal, carousel, dropdown.
  • Popper.js: برای ابزارهایی که به موقعیت‌دهی نیاز دارند (مثل dropdown و tooltip).

توجه: بدون اضافه کردن JS و Popper، بعضی کامپوننت‌ها درست کار نمی‌کنند.


3. نصب نسخه RTL بوتسترپ

  • برای سایت‌های فارسی یا راست‌به‌چپ، نیاز به نسخه RTL (Right-To-Left) است.
  • روش‌ها:
    1. استفاده از CDN نسخه RTL:
      • مثال:

         

        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-rtl@4.6.0-3/dist/css/bootstrap-rtl.min.css">
        
    2. دانلود نسخه RTL و اضافه کردن به پروژه.
  • این نسخه تمام کلاس‌ها را برای راست‌چین کردن صفحات آماده می‌کند و نیازی به تغییر کلاس‌ها نیست.

4. سایر نکات

  • توصیه می‌شود ابتدا نسخه CDN را امتحان کنید، سپس در صورت نیاز نسخه محلی را دانلود کنید.
  • همیشه نسخه‌های CSS و JS هماهنگ باشند تا تداخل پیش نیاید.
  • برای پروژه‌های فارسی، استفاده از Bootstrap RTL راحتی و سازگاری بیشتری ایجاد می‌کند.