دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)



  • ۲۶
  • اردیبهشت

جلسه ۰۴ : استفاده از CSS Button – Pushy Buttons

  • دسته‌بندی‌ها :
جلسه ۰۴ : استفاده از CSS Button – Pushy Buttons
    • جزئیات
    • نوع محتواآموزشی

      مقدمه

      سلام خدمت دوستان و همراهان عزیز سایت پی وی لرن . با آموزش css_buttons در خدمتتون هستیم. در ادامه مباحث کتاب خانه ها در CSS Button به بررسی کتابخانه Pushy ButtonsدرCSS Button و استفاده از Pushy Buttons در CSS Buttons می پردازیم.

      استفاده از Pushy Buttons در CSS Buttons

      کتابخانه Pushy Buttons یک کتابخانه کوچک CSS Pressable Buttons است.

      بارگذاری bttn.css

      برای بارگذاری کتابخانه pushy-buttons.min.css، دانلود کنید CSS را از github و خط زیر را در قسمت <head> صفحه وب قرار دهید.

      مثال : 

      استفاده از Button

      یک دکمه با استفاده از تگ دکمه HTML ایجاد کنید و سبک های btn، btn-blue را با اندازه مشخص btn-lg اضافه کنید.

      مثال : 

      خروجی زیر را تولید می کند.

       

      تعریف Size

      شما می توانید اندازه یک دکمه را با تعیین اندازه آن با استفاده از CSS و استفاده از آن با نام کلاس، افزایش دهید یا کاهش دهید، همانطور که در زیر نشان داده شده است. در مثال داده شده، ما تغییرات چهار اندازه را داریم.

      مثال : 

      خروجی زیر را تولید می کند.

       

      تعریف Color

      درست مثل اندازه، شما می توانید رنگ دکمه را با استفاده از CSS تعریف کنید. مثال زیر نشان می دهد که چگونه رنگ دکمه را تغییر دهید.

      مثال : 

      خروجی زیر را تولید می کند.

      کلام پایانی

      در ادامه مباحث کتاب خانه ها در CSS Button به بررسی کتابخانه Pushy ButtonsدرCSS Button و استفاده از Pushy Buttons در CSS Buttons پرداختیم.

      QR:  جلسه ۰۴ : استفاده از CSS Button – Pushy Buttons
      به اشتراک بگذارید