Web-Development-Bootcamp/Striver97/HTML/price-details-table/index.html at ab556a0bfba4c9ed3ad5ea90185b632f6ec5d2dc · FrontendFreaks/Web-Development-Bootcamp · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Product Prices</title>
  <style>
    table {
      width: 100%;
      border-collapse: collapse;
    }
    th, td {
      padding: 18px;
      text-align: left;
      border-bottom: 1px solid #ddd;
    }
    th {
      background-color: #f2f2f2;
    }
  </style>
</head>
<body>
  <h2>Product Prices</h2>
  <table>
    <thead>
      <tr>
        <th>Product Name</th>
        <th>Description</th>
        <th>Price</th>
        <th>Availability</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Laptop</td>
        <td>15-inch, Intel Core i5, 8GB RAM, 256GB SSD</td>
        <td>$999</td>
        <td>In stock</td>
      </tr>
      <tr>
        <td>Smartphone</td>
        <td>6.5-inch, 128GB Storage, 12MP Camera</td>
        <td>$699</td>
        <td>In stock</td>
      </tr>
      <tr>
        <td>Headphones</td>
        <td>Wireless, Noise Cancelling, 30-hour Battery Life</td>
        <td>$199</td>
        <td>In stock</td>
      </tr>
      <tr>
        <td>Smartwatch</td>
        <td>Waterproof, Heart Rate Monitor, Fitness Tracker</td>
        <td>$149</td>
        <td>Out of stock</td>
      </tr>
      <tr>
        <td>Camera</td>
        <td>24MP, 4K Video Recording, Interchangeable Lenses</td>
        <td>$799</td>
        <td>In stock</td>
      </tr>
    </tbody>
  </table>
</body>
</html>