بوت استرپ چیه و چه کاربردی داره
بوت استرپ یک چارچوب توسعه وب رایگان و متن باز است. و طراحی شده است تا با ارائه مجموعه ای از کلاس ها و استایل های از پیش تعریف شده برای طرحی قالب ظاهری سایت بکار رود ، و بتوانیم به کمک آن سایتی واکنشگرا و ریسپانسیو پیاده سازی کنیم . بوت استرپ یکی از محبوب ترین فریم ورک های css است که به ما قابلیت طراحی سایت برای تمام دستگاه ها را میدهد و کار برنامه نویسان و طراحان سایت را برای ایجاد یک سایت ریسپانسیو آسان کرده است .
چرا باید از بوت استرپ استفاده کرد ؟
سهولت در استفاده
اول از همه یادگیری بوت استرپ آسان است و با توجه به محبوبیت آن تعداد زیادی آموزش و انجمن های آنلاین برای کمک به شما برای شروع در دسترس هستند ، یکی از دلایل محبوبیت بوت استرپ در بین توسعه دهندگان وب و طراحان وب این است که ساختار فایل ساده ای دارد. فایل‌های آن برای دسترسی آسان کامپایل شده‌اند و برای اصلاح آن‌ها فقط به دانش اولیه HTML، CSS و JS نیاز است.
برای افزایش زمان بارگذاری صفحه سایت، بوت استرپ فایل های CSS و جاوا اسکریپت را کوچک می کند. علاوه بر این، بوت استرپ یکپارچگی را در سینتکس بین وب سایت ها و توسعه دهندگان حفظ می کند که برای پروژه های مبتنی بر تیم ایده آل است.
گرید یا شبکه ریسپانسیو
علاوه بر این، سیستم شبکه بوت استرپ فرآیند ورود داده ها را ساده تر می کند. این شامل تعداد زیادی پرس و جو رسانه ای است که به شما امکان می دهد نقاط شکست سفارشی هر ستون را بر اساس نیازهای پروژه وب خود تعریف کنید. تنظیمات پیش فرض معمولا بیش از اندازه کافی هستند. پس از ایجاد یک شبکه، فقط باید محتوا را به کانتینرها اضافه کنید.
سازگاری مرورگرها
تصاویر در بوت استرپ
بوت استرپ نمایش و پاسخگویی تصویر را با قوانین HTML و CSS از پیش تعریف شده خود کنترل می کند. با افزودن کلاس .img-responsive اندازه تصاویر به طور خودکار بر اساس اندازه صفحه نمایش کاربران تغییر می کند. این به عملکرد وب سایت شما کمک می کند، زیرا کاهش اندازه تصویر بخشی از فرآیند بهینه سازی سایت است.Bootstrap همچنین کلاس های اضافی مانند .img-circle و .img-rounded را ارائه می دهد که به تغییر شکل تصاویر کمک می کند.
مستندات بوت استرپ
نحوه استفاده از بوت استرپ در توسعه وب
برای دریافت دید بهتر از نحوه استفاده از بوت استرپ، به مثال زیر نگاه کنید.
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bootstrap 101 Template</title>
<link href="css/bootstrap.min.css" rel="stylesheet" />
</head>
<body data-rsssl=1>
<h1>Hello, world!</h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
meta charset="utf-8"
مجموعه کاراکتری که برای نوشتن وب سایت استفاده می شود را بیان می کند. در این مورد، UTF-8 به یونیکد اشاره دارد.
meta http-equiv="X-UA-Compatible"
نسخه اینترنت اکسپلورر را که باید صفحه را رندر کند تعیین می کند. با استفاده از حالت Edge، تنظیم شده است که از بالاترین حالت موجود استفاده کند.
meta name="viewport"
اطمینان حاصل می کند که صفحه دارای نسبت 1:1 با اندازه نمایش است.
link href="css/bootstrap.min.css" rel="stylesheet"
اینجاست که CSS هسته بوت استرپ را اضافه می کنیم.
src="js/bootstrap.min.js
جاوا اسکریپت هسته بوت استرپ را اضافه می کند.
در نتیجه
بوت استرپ یک فریم ورک فرانت اند رایگان است که امروزه در بین توسعه دهندگان، به ویژه آنهایی که در دنیای طراحی وب کار می کنند، محبوب است. استفاده از آن آسان است و زمان زیادی را برای توسعه دهندگان از نوشتن کدهای HTML، CSS و جاوا اسکریپت به صورت دستی صرفه جویی می کند.
چارچوب بوت استرپ به اندازه کافی منعطف و قوی است تا تقریباً هر نیازی را برای توسعه وب سایت جلویی برآورده کند. بهترین ویژگی آن، قالب های طراحی است که باعث می شود صفحات وب در تمام اندازه های صفحه نمایش بهینه کار کنند.