نوارهای پیشرفت

نمونه های پیش فرض

اجزای پیشرفت با دو ساخته شده است عناصر HTML، مقداری CSS برای تنظیم عرض و چند ویژگی.

پس زمینه ها

از کلاس های پس زمینه ابزار استفاده کنید ظاهر نوارهای پیشرفت فردی را تغییر دهید.

نمونه برچسب ها

با قرار دادن متن در نوار پیشرفت، برچسب‌ها را به نوارهای پیشرفت خود اضافه کنید.progress-bar.

25%

میله های متعدد

در صورت نیاز، چندین نوار پیشرفت را در یک جزء پیشرفت قرار دهید.

ارتفاع

ما فقط یک را تنظیم کردیمheightارزش بر روی.progress-bar، بنابراین اگر تغییر دهید که برای بیرون ارزش قائل هستند.progressبه طور خودکار بر این اساس اندازه تغییر می کند.

راه راه های متحرک

گرادیان راه راه نیز می تواند باشد متحرک اضافه کنید.progress-bar-animatedبه.progress-barبرای متحرک کردن راه راه راست به چپ از طریق انیمیشن های CSS3.

راه راه

اضافه کنید.progress-bar-stripedبه هر.progress-barاعمال کردن a از طریق گرادیان CSS روی رنگ پس‌زمینه نوار پیشرفت خط بکشید.

پیشرفت متحرک

اضافه کنید.animated-progessکلاس با.progress-barبرای نوار پیشرفت متحرک.