دکمه ها

استایل ها

پیش فرض

استایل دکمه پیش فرض با رنگ های مختلف برای انتخاب. ترجیح دهید از 2 یا حداکثر 3 تغییر رنگ دکمه در پروژه وب خود استفاده کنید تا UX بهتری ارائه دهید و آن را برای کاربران خود در دسترس تر کنید.

btn-primary
btn-secondary
btn-success
btn-info
btn-warning
btn-danger
btn-dark
btn-light

اوت لاین

استایل های اوت لاین نیز برای همه تغییرات رنگ قبلی موجود است

btn-outline-primary
btn-outline-secondary
btn-outline-success
btn-outline-info
btn-outline-warning
btn-outline-danger
btn-outline-dark
btn-outline-light

استایل جایگزین

استایل دکمه جایگزین استایل طراحی ظریف تری را ارائه می دهد.

btn-alt-primary
btn-alt-secondary
btn-alt-success
btn-alt-info
btn-alt-warning
btn-alt-danger

قهرمان

استایل عالی برای استفاده در صفحات فرود یا دکمه های فراخوانی

btn-hero btn-primary
btn-hero btn-secondary
btn-hero btn-success
btn-hero btn-info
btn-hero btn-warning
btn-hero btn-danger
btn-hero btn-dark
btn-hero btn-light

افکت ها

موج دار شدن

با الهام از طراحی متریال، افزودن یک انیمیشن موج دار روی کلیک فقط یک ویژگی داده است data-toggle="click-ripple"

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

تغییرات

اندازه کوچک

می توانید از کلاس ها استفاده کنید btn-sm و btn-sm تا دکمه های خود را کوچکتر کنید

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

سایز بزرگ

می توانید از کلاس ها استفاده کنید btn-lg و btn-lg تا دکمه های خود را بزرگتر کنید

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

مربع

اگر به دنبال ظاهری واضح با استفاده از کلاس هستید، می توانید شعاع حاشیه را از دکمه های خود حذف کنید rounded-0

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

گرد شده

دکمه های کاملا گرد برای همه استایل های دکمه موجود در دسترس هستند

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

غیرفعال

اگر عملکردی در وضعیت خاصی از وب سایت/برنامه شما در دسترس نیست، می توانید به راحتی دکمه های خود را غیرفعال کنید

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

آیکون

شما می توانید از هر یک از آنها استفاده کنید آیکون های موجود در دکمه های خود را به تجسم عمل مورد نظر خود را

استایل پیش فرض

استایل اوت لاین

استایل جایگزین

استایل قهرمان

خلاقانه

هر یک از کلاس های موجود را برای ایجاد استایل دکمه ای که می خواهید در پروژه خود استفاده کنید، مخلوط کنید