| 123456789101112131415161718192021222324252627282930313233343536 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8" />
- <link rel="stylesheet" href="./../../reset.css">
- <link rel="stylesheet" href="./progress.css">
- </head>
- <body>
- <div style="padding: 10px; background-color: gray;">
- <div class="progress">
- <div class="progress-text">10%</div>
- <div class="progress-bar" style="width: 10%;"></div>
- </div>
- <br><br>
- <div class="progress blue">
- <div class="progress-text">25%</div>
- <div class="progress-bar" style="width: 25%;"></div>
- </div>
- <br><br>
- <div class="progress green">
- <div class="progress-text">50%</div>
- <div class="progress-bar" style="width: 50%;"></div>
- </div>
- <br><br>
- <div class="progress red">
- <div class="progress-text">75%</div>
- <div class="progress-bar" style="width: 75%;"></div>
- </div>
- <br><br>
- <div class="progress white">
- <div class="progress-text">100%</div>
- <div class="progress-bar" style="width: 100%;"></div>
- </div>
- </div>
- </body>
- </html>
|
