Page 198 - Computer Software Application TP - Volume 1
P. 198

COMPUTER SOFTWARE APPLICATION - CITS




              •  Save the program as a .html file

              •  Open the html file with a web browser
              •  Verify the output.















           TASK 3: Using Progress Bars

           1  create a progress bar
              •  Open the text editor
              •  Write the following codes
                 <html lang=”en”>
                 <head>
                 <title>Bootstrap Example</title>
                 <meta charset=”utf-8”>
                 <meta name=”viewport” content=”width=device-width, initial-scale=1”>
                 <link href=https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css rel=”stylesheet”>
                 <script src=”https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js”></script>
                 </head>
                 <body>

                 <div class=”container mt-3”>
                 <h2>Progress Bar With Label</h2>
                 <div class=”progress” style=”height:20px”>
                 <div class=”progress-bar” style=”width:50%”>50%</div>
                 </div>
                 </div>


                 </body>
                 </html>
              •  Save the program as a .html file
              •  Open the html file with a web browser
              •  Verify the output.



















                                                           183

                               CITS : IT & ITES - Computer Software Application - Exercise 47
   193   194   195   196   197   198   199   200   201   202   203