نوارهای پیشرفت
نمونه های پیش فرض
اجزای نوار پیشرفت توسط دو المان HTML ساخته می شوند، مقداری CSS برای تنظیم عرض و چند attribute.
پس زمینه ها
از کلاس های کاربردی پس زمینه برای تغییر ظاهر هر نوار پیشرفت استفاده کنید.
نمونه برچسب ها
با قرار دادن متن داخل .progress-bar
برچسب ها را به نوار های پیشرفت اضافه کنید .
نوار های چندگانه
در صورت نیاز چند نوار پیشرفت را داخل یک نوار پیشرفت قرار دهید.
ارتفاع
ما تنها یک مقدار height
بر روی .progress
تنظیم میکنیم، بنابراین در صورت تغییر این مقدار، ارتفاع .progress-bar
داخلی به صورت خودکار بر اساس آن تغییر خواهد کرد.
راه راه متحرک
طرح راه راه همچنین میتواند متحرک باشد. کلاس .progress-bar-animated
را به .progress-bar
اضافه کنید تا نوار های راه راه توسط انیمیشن های CSS3 از راست به چپ حرکت کنند.
راه راه
افزودن .progress-bar-striped
به هر .progress-bar
برای افزودن طرح راه راه به پس زمینه نوار پیشرفت کاربرد دارد.
پیشرفت متحرک
افزودن .animated-progess
به همراه .progress-bar
باعث متحرک شدن پیشرفت نوار می شود.