دوره های آموزشی
خانه / طراحی وب / آموزش Bootstrap – مقدمه و راه اندازی

آموزش Bootstrap – مقدمه و راه اندازی

Bootstrap چیست ؟

بوت استرپ یک فریم ورک قدرتمند  است که با آن می توان برنامه های تحت وب را به   سرعت ایجاد کرده  و توسعه دهیم .

دلایل استفاده از Bootstrap

  • پشتیبانی مرورگرها : به وسیله مرورگر های معروف پشتیبانی می شود.
    bootstrap_tutorial_www.acdev.ir
  • به راحتی قابل یادگیری است : با دانستن تنها HTML و CSS  می توان از Bootstrap استفاده کرد.
  • طراحی واکنشگرا : CSS موجود در Bootstrap واکنشگرا بوده و خود را با دسکتاپ ها ، موبایل ها و تبلت ها تطبیق می دهد.
  • راه حلی یکدست و تمیز برای ایجاد رابط کاربری در اختیار برنامه نویسان قرار می دهد.
  • شامل کامپوننت های زیبا و کاربردی که به راحتی قابلیت سفارشی سازی دارند.
  • و از بهترین ویژگی های آن متن باز ( open source) بودن است .

 راه اندازی Bootstrap

در این قسمت نحوه استفاده از Bootstrap و ساختار فایل های آن را توضیح می دهیم .

 دانلود Bootstrap

برای دانلود آخرین نسخه Bootstrap  به  http://getbootstrap.com/  بروید :

bootstrapDownload

در اینجا 2 دکمه وجود دارد :

  • Download Bootstrap : با انتخاب این گزینه شما می توانید همه فایل های از قبل کامپایل شده و فشرده شده شامل CSS و JavaScript و فونت ها را دانلود کنید. این قسمت شامل داکیومنت ها و فایل های کد منبع اصلی نمی شود.
  •  Download Source : این گزینه آخرین نسخه کد های منبع  Bootstrap LESS و JavaScript را مستقیما از GitHub دانلود می کند.

برای درک راحت مطالب ما از گزینه اول که شامل فایل های از قبل کامپایل شده و آماده Bootstrap می باشد استفاده می کنیم . همچنین در زمان نوشتن این متن از آخرین نسخه Bootstrap 3 استفاده شده است .

ساختار فایل ها 

بعد از اینکه Bootstrap را دانلود کرده و آن را از حالت فشرده خارج کردید ساختار پوشه ها و فایل ها به شکل زیر خواهد بود:

bootstrap_structure.ir

هماگونه که می بینید شامل فایل های CSS و JS که با (*.boostrap)  و هچنین فایل های فشرده  CSS و JS که با (*.bootstrap.min) شروع می شوند می باشد. فونت ها و آیکن ها نیز به صورت اختیاری قابل استفاده درقالب می باشند.

قالب HTML

یک قالب HTML پایه که از bootstrap استفاده می کند به شکل زیر است:

همانگونه که می بینید فایل های jquery.js و bootstrap.min.js و bootstrap.min.css جزء فایل های اصلی قالب bootstrap می باشند.

درباره ی asadi

همچنین ببینید

فیلم آموزش jQuery

فیلم آموزش jQuery قسمت 3

در قسمت سوم از سری فیلم آموزش jQuery به بررسی نحوه ساخت یک افکت انیمیشنی در ...

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *