Lab 6.1 HTML
unknown
html
a year ago
1.5 kB
8
Indexable
Never
Lab 6.1
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Shopping List</title>
<style>
.line {
display: flex;
align-items: center;
}
.line input {
margin-left: 15px;
}
table {
border-collapse: collapse;
width: 50%;
border: 2px solid black;
}
</style>
</head>
<script src = "1.js"></script>
<body>
<h1>Shopping List</h1>
<br>
<table id ="table">
<thead>
<tr>
<th>Item Name</th>
<th>Amount</th>
<th>Price</th>
</tr>
</thead>
<tbody id = "output">
</tbody>
</table>
<br>
<button onclick="Reset()">Reset list</button>
<br>
<h2>Add Item</h2>
<br>
<div class="line">
<h4>Name: </h4>
<input type="text" name="name" id="n">
</div>
<div class="line">
<h4>Amount: </h4>
<input type="text" name="amount" id="a">
</div>
<div class="line">
<h4>Price: </h4>
<input type="text" name="price" id="p">
</div>
<button onclick="add()">Add</button>
<button onclick="Clear()">Clear</button>
</body>
</html>