index.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hancie e-Learning Studio</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/
bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/
jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/
bootstrap.min.js"></script>
</head>
<body>
<?php
include "connection.php";
$sql="SELECT SUM(Tea_ID) as Total FROM tea_record";
$query=mysqli_query($conn, $sql);
while ($row=mysqli_fetch_array($query)) {
?>
<div class="container">
<h2>Basic Progress Bar</h2>
<div class="progress">
<div class="progress-bar progress-bar-success progress-bar
-striped active" role="progressbar" aria-valuenow="70"
aria-valuemin="0" aria-valuemax="100" style="width:<?php echo
$row['Total'];?>%">
<?php echo $row['Total'];?>%
</div>
</div>
</div>
<?php
}
?>
</body>
</html>
Output
