آموزش بوت استرپ ۴

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
< Bootstrap 4:Tutorial(تغییرمسیر از Bootstrap 4:خانه)
پرش به ناوبری پرش به جستجو
Main Page Tutorial
Bootstarp4-menu.png
موارد آموزشی
۱خانه
۲شروع
۳ظرف‌ها
۴شبکه‌بندی پایه
۵تایپوگرافی
۶رنگ‌ها
۷جدول‌ها
۸تصاویر
۹جامبوترون
۱۰هشدارها
۱۱کلیدها
۱۲گروه‌های کلید
۱۳نشان‌ها (Badges)
۱۴نوارهای پیشرفت
۱۵Spinnerها
۱۶صفحه‌بندی
۱۷گروه‌های لیست
۱۸کارت‌ها
۱۹منوهای کرکره‌ای
۲۰Collapse
۲۱Navها
۲۲Navbar
۲۳فرم‌ها
۲۴ورودی‌ها
۲۵گروه‌های ورودی
۲۶فرم‌های سفارشی
۲۷Carousel
۲۸Modal
۲۹راهنمای ابزار
۳۰Popover
۳۱Toast
۳۲Scrollspy
۳۳امکانات
۳۴Flex
۳۵آیکن‌ها
۳۶Media Objects
۳۷فیلترها
شبکه‌بندی
Theme
مرجع


بوت استرپ ۴ جدیدترین نسخه بوت استرپ است، که معروفترین چارچوب Framework ,HTML ,CSS و JavaScript است را برای توسعه وب‌سایت‌های واکنش گرا و Mobile-first است.

استفاده و دانلود بوت استرپ ۴ کاملاً رایگان است!

همین حالا آموزش بوت استرپ را شروع کن»

با مثال‌های خود آن را امتحان کنید

آموزش بوت استرپ ۴ دارای صدها مثال از بوت استرپ ۴ است.[۱]

با استفاده از ویرایشگر (Editor) آنلاین ما، شما می‌توانید کد را تغییر داده و برای مشاهدهٔ نتیجه برروی یک کلید کلیک کنید.

  • Imgdefault.jpg

مثال بوت استرپ ۴ 

<div class="jumbotron text-center">
  <h1>My First Bootstrap Page</h1>
  <p>Resize this responsive page to see the effect!</p>
</div>

<div class="container">
  <div class="row">
    <div class="col-sm-4">
      <h3>Column 1</h3>
      <p>Lorem ipsum dolor..</p>
    </div>
    <div class="col-sm-4">
      <h3>Column 2</h3>
      <p>Lorem ipsum dolor..</p>
    </div>
    <div class="col-sm-4">
      <h3>Column 3</h3>
      <p>Lorem ipsum dolor..</p>
    </div>
  </div>
</div>


روی کلید «مشاهدهٔ نتیجه» کلیک کنید تا ببینید چگونه عمل می‌کند.

بوت استرپ ۳ در مقابل بوت استرپ ۴

بوت استرپ ۴ جدیدترین نسخه بوت استرپ است؛ با مؤلفه‌های جدید، صفحات سریع‌تر و واکنش‌گرایی (Responsiveness) بیشتر.

بوت استرپ ۴ آخرین نسخهٔ پایدار همهٔ مرورگرها و پلت فرم‌ها را پشتیبانی می‌کند. با این حال Internet Explorer 9 و قدیمی‌تر پشتیبانی نمی‌شوند.

اگر نیازمند پشتیبانی IE8-9 هستید، از بوت استرپ ۳ استفاده کنید. بوت استرپ ۳ پایدارترین نسخهٔ بوت استرپ است و همچنان برای تعمیر مشکلات (به انگلیسی: Bugfix) و تغییرات مستندسازی توسط تیم پشتیبانی می‌شود. با این حال، ویژگی‌های جدیدی به آن اضافه نخواهد شد.

برو به بوت‌استرپ ۳ »

الگوی پایه بوت استرپ ۴

ما با بوت استرپ ۴ یک الگوی اولیهٔ واکنش گرا ایجاد کرده‌ایم. شما می‌توانید این الگو را تغییر دهید، ذخیره کنید، به اشتراک بگذارید و در پروژه‌های خود استفاده کنید:

مرجع‌های بوت استرپ

لیست کامل همهٔ کلاس‌های بوت استرپ ۴ با توضیح و مثال‌ها.

اگر می‌خواهید استفاده بیشتری از مؤلفه‌های بوت استرپ داشته باشید، مرجع کامل JavaScript/jQuery بوت استرپ ۴ را مشاهده کنید - همه موارد دارای مثال‌های “مشاهدهٔ نتیجه” هستند:

همه کلاس‌های محبوب CSS بوت استرپ


آیا می‌دانستید؟

WikiCod.CSS یک جایگزین عالی برای بوت استرپ است.

WikiCod.CSS کوچکتر، سریعتر و استفاده از آن ساده‌تر است.

اگر می‌خواهید WikiCod.CSS را بیاموزید، به آموزش WikiCod.CSS ما مراجعه کنید.


منابع آموزشی

  1. ↑ w3schools.com: Bootstrap 4 Tutorial



برگرفته از «https://wikicod.ir/w/index.php?title=Bootstrap_4:Tutorial/خانه&oldid=21122»