نحوه ایجاد صفحه فرود (Landing Page) با Bootstrap 4
Bootstrap 4 اینک دوست داستنیترین کادرورک front-end در عالم میباشد. طراحی اپلیکیشن در مشهد شما میتوانید از آن برای ایجاد کرد هر نوع رابط کاربری، از پوستههای ادمین تا اینترنتوبسایتهایی دارنده خصوصیت بدون نقص به کارگیری فرمایید. درین یادگرفتن قدم به قدم ما به طریق تشکیل داد یک شیت فرود یا این که به عبارتی landing page با به کار گیری از بوتاسترپ 4 نگاهی میاندازیم . شما میتوانید از آن تحت عنوان برگه اساسی استعمال فرمائید یا این که آن را به یک کمپین بازاریابی خاص متصل نمایید.
برگه فرودی که میخواهیم بسازیم دارنده پنج نصیب پایین میباشد:
یک نوار پیمایش اثبات،
نصیب hero،
قسمت سرویس ها سه ستونی،
نصیب تماس با ما با پهنا بدون نقص،
و یک فوتر.
با این وجود، با به عبارتی منطق می توانید نصیبهای دیگری را مثل توضیحات، وبلاگ و اشکال دیگر محتوا ساخت و ساز نمائید. در تصویر پایین شیت فرود آخری را می بینید:
بهتر، بیایید برویم آغاز کنیم.
1. فعال سازی Bootstrap 4
یکسری طرز برای آغاز فعالیت با بوتاسترپ 4 وجود دارااست. شما می توانید:
CSS .1 و JavaScript را دانلود فرمایید و آن را به شیت HTML خویش اضافه فرمائید،
2. بوتاسترپ 4 را با استعمال از pipeline خویش تهیه فرمایید (چنانچه میخواهید فولدرهای Sass را بازنویسی نمایید این را تعیین نمائید)،
3. از نسخه CDNی CSS و JavaScript استعمال نمائید.
درین نمونه، ما از طریق اولیه به کارگیری میکنیم. CSS نادروسعت گردیده (minified) را به نصیب کاغذ HTML خویش اضافه نمایید و فولدر جاوااسکریپت را صحیح پیش از بستن تگ < body> بگذارید. ازآنجاکه همگی افزونههای بوت استرپ 4 به jQuery بستگی دارا هستند، jQuery را نیز می بایست پیش از اسکریپت بوتاسترپ نادروسعت گردیده بگنجانید.