- Foundation Tutorial
- Foundation - Home
- Foundation - Overview
- Foundation - Installation
- Foundation - Starter Projects
- Foundation - Kitchen Sink
- Foundation General
- Foundation - Global Styles
- Foundation - Sass
- Foundation - JavaScript
- Foundation - JavaScript Utilities
- Foundation - Media Queries
- Foundation - The Grid
- Foundation - Flex Grid
- Foundation - Forms
- Foundation - Visibility Classes
- Foundation - Base Typography
- Foundation - Typography Helpers
- Foundation - Basic Controls
- Foundation - Navigation
- Foundation - Containers
- Foundation - Media
- Foundation - Plugins
- Foundation SASS
- Foundation - Sass Functions
- Foundation - Sass Mixins
- Foundation Libraries
- Foundation - Motion UI
- Foundation Useful Resources
- Foundation - Quick Guide
- Foundation - Useful Resources
- Foundation - Discussion
Foundation - Media Progress Bar
Progress bar is used to display your progress and can be added to your layouts. You require only two elements of HTML and they are simple and easy to customize.
The following table shows how the progress bar can be used in Foundation.
| Sr.No. | Progress bar detail & Description |
|---|---|
| 1 | Basics
Progress bar contains two elements such as container and a meter. |
| 2 | Colors
Styling the progress bar can be done by using the color classes such as .success, .warning and .alert. |
| 3 | With Text
Progress bar can be used with text by using progress-meter-text class. |
| 4 | SASS Reference
You can change the styles of the components by using SASS Reference. |
foundation_media.htm
Advertisements