html中购物车代码

在网页中，经常会出现购物车的代码，让我们可以快速方便地将商品添加到购物车中，下面是一个简单的示例代码：

<div class="cart">
  <ul class="cart-items">
    <li class="cart-item">
      <div class="cart-item-image">
        <img src="product1.jpg" alt="Product 1">
      </div>
      <div class="cart-item-details">
        <h4 class="cart-item-name">Product 1</h4>
        <p class="cart-item-price">$19.99</p>
        <div class="cart-item-quantity">
          <label for="product1-qty">Quantity:</label>
          <input type="number" id="product1-qty" name="product1-qty" value="1">
        </div>
        <button class="cart-item-remove">Remove</button>
      </div>
    </li>
  </ul>
  <div class="cart-total">
    <p class="cart-total-label">Total:</p>
    <p class="cart-total-amount">$19.99</p>
  </div>
  <button class="cart-checkout">Checkout</button>
</div>

在这段代码中，我们使用了div和ul标签来创建购物车的整体结构和商品列表。每个商品都是一个li元素，包含商品图片、名称、价格、数量和删除按钮等内容。购物车还有一个总价和结算按钮，使用了div和p标签。这段代码可以根据具体需求进行修改和扩展。