فریم ورک Bootstrap این روزها کاربرد فراوانی در طراحی سریع و استاندارد صفحات وب دارد . در این مطلب می خواهیم ۱۰ نمونه کد را معرفی کنیم که فقط با کپی/پیست کردن می توانید قابلیت های جالبی را توسط آنها به سایت اضافه کنید .

برای استفاده از این مثال ها کافیست کد های HTML و CSS هر کدام را دریافت کرده و در پروژه خود قرار دهید.

۱- فرم ورود داخل کادر

یک فرم ورود و ثبت نام جمع و جور که داخل Modal می توانید از آن استفاده کنید . برای موارد “برای ادامه لاگین کنید…” مناسب است.

۲- تایم لاین BOOSTRAP

اگر می خواهید رویدادهایی را به ترتیب زمانی و در یک ساختار ساده و جذاب و قابل فهم نمایش دهید ، پیشنهاد ما به شما این گزینه است.

۳- جدول قیمت هاستینگ

طراحی لیست قیمت پلن های هاستینگ ها معمولا یکی از کارهای زمان بر طراحی است زیرا به صورت پیش فرض این امکان در Bootstrap وجود ندارد . با استفاده از این اسکریپت می توانید خیلی سریع یک لیست پلن خوب و جذاب ایجاد کنید.

۴- انجمن

یک ساختار ساده و زیبا برای ایجاد قالب انجمن به صورت ریسپانسیو. به علاوه تماما با کلاس های بوت اسنرپ ایجاد شده است و فقط ۵ خط کد css اضافه دارد.

۵- قالب ساده رزومه

یک ساختار ساده با بخش های مجزا، نوار پیشرفت و دکمه های شبکه های اجتماعی.

۶- پنل های زیبا و ریسپانسیو

قابلیت نمایش امکانات یک محصول و یا مهارت های شخصی و … با این اسنیپت مهیاست.

۷- جدول قیمت واکنش گرا

یک لیست قیمت دیگر با رنگ آمیزی متفاوت و سازگاری کامل یا قالب شما.

۸- فرم ورود / ثبت نام

یک فرم ورود / ثبت نام مینیمال با تب های جداگانه برای هر کدام و بخش پرداخت. اعتبارسنجی فیلدها را ندارد.

۹- لوگوی پارالکس منو

یک نمونه از منوهای بوت استرپ به علاوه امکان تغییر سایز لوگو هنگام پیمایش صفحه به بالا و پایین. همچنین این مثال از کمی کد جاوااسکریپت برای این عمل استفاده می کند که حتما باید آن را نیز به صفحه اضافه کنید.

۱۰- صفحه نمونه کارها

مناسب برای نمایش گالری تصاویر و نمونه کارها

منبع