آموزش کار با دکمه ها Button در Bootstrap 4 -قسمت12

سلام و خدا قوت به شما دوستان همراه و حرفه ای با یه آموزش دیگه با عنوان دکمه ها در بوت استرپ 4 در خدمتتون هستیم. در این آموزش یاد می گیریم که چطور دکمه های جذاب و استاندارد رو به سادگی برای صفحه نمایشمون طراحی کنیم. Button Styles بوت استرپ 4 این امکان را برای ما فراهم می کند سبک های متفاوتی از دکمه ها را داشته باشیم. با اضافه کردن کلاس btn به تگ a , button , input می توانیم دکمه هایی را با طرح های جذاب و استاندارد داشته باشیم. Button Outline با اضافه کردن کلاس btn-outline به تگ موجود، بوت استرپ امکان ایجاد دکمه با حاشیه رنگی و هم چنین حالت هاور(با رفتن موس بر روی دکمه رنگ بک گراند تغییر میکند) را نیز به ما می دهد. Button Sizes با استفاده از کلاس .btn-lg می توانیم دکمه هایی با سایز بزرگ و هم چنین با اضافه کردن کلاس .btn-sm دکمه هایی با سایز کوچک داشته باشیم. Block Level Buttons یکی از مزایای استفاده از کلاس های بوت استرپ در حین طراحی، امکان ایجاد دکمه ی تمام عرض می باشد. با اضافه کردن کلاس .btn-block می توانیم دکمه هایی با عرضی برابر با عرض المان والد داشته باشیم. Active/Disabled Buttons دکمه ها این قابلیت را دارند که به صورت فعال(قابل کلیک شدن) و غیر فعال(غیر قابل کلیک شدن) تنظیم شوند. با اضافه کردن کلاس .active می توانیم دکمه هایی با قابلیت فشرده شدن و فعال در صفحه داشته باشیم. هم چنین کلاس .disabled قابلیت دی اکتیو (غیر قابل فشرده شدن) را برای دکمه ها ایجاد می کند. Spinner Buttons یکی دیگر از قابلیت های دکمه ها در بوت استرپ، اضافه کردن Spinner به دکمه است. با اضافه کردن کلاس spinner-border می توانیم این ویژگی را به دکمه اضافه کنیم. دانلود از وبسایتwww.heilton.com