Update index.html

ibm-developer-skills-network · Oct 13, 2024 · ec898e5 · ec898e5
1 parent badce31
commit ec898e5
Showing 1 changed file with 18 additions and 7 deletions.
diff --git a/index.html b/index.html
@@ -1,16 +1,27 @@
+<!DOCTYPE html>
 <html>
     <head>
-    <script src="script.js"></script>
-    <link rel="stylesheet" href="style.css">
+        <title>Simple Interest Calculator</title>
+        <script src="script.js"></script>
+        <link rel="stylesheet" href="style.css">
     </head>
     <body>
         <h1>Simple Interest Calculator</h1>
 
-        Amount <input type="number"  id="principal">  <br/>
-        Rate <input type="number"  id="rate">  <br/>
-        No. of Years <input type="number"  id="years">  <br/>
-        Interest : <span id="result"></span><br>
+        <form>
+            <label for="principal">Amount (Principal): </label>
+            <input type="number" id="principal" placeholder="Enter principal amount" required> <br/><br/>
+
+            <label for="rate">Rate of Interest (%): </label>
+            <input type="number" id="rate" placeholder="Enter rate of interest" required> <br/><br/>
+
+            <label for="years">No. of Years: </label>
+            <input type="number" id="years" placeholder="Enter number of years" required> <br/><br/>
+
+            <button type="button" onclick="compute()">Compute Interest</button>
+        </form>
+
+        <h2>Calculated Interest: <span id="result">0</span></h2>
 
-        <button onclick="compute()">Compute</button>
     </body>
 </html>