HTML5網(wǎng)頁購物車代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>購物車頁面</title>
<style>
/* 添加樣式 */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
#title {
background-color: #333333;
color: #ffffff;
padding: 20px;
text-align: center;
}
#cart-content {
width: 800px;
margin: 20px auto;
}
table {
border-collapse: collapse;
width: 100%;
}
th {
text-align: left;
background-color: #dddddd;
padding: 10px;
}
td {
border: 1px solid #dddddd;
padding: 10px;
}
.add-to-cart-btn {
background-color: #4CAF50;
color: #ffffff;
border: none;
padding: 10px;
text-align: center;
text-decoration: none;
display: inline-block;
margin: 4px 2px;
cursor: pointer;
}
.add-to-cart-btn:hover {
background-color: #3e8e41;
}
</style>
</head>
<body>
<div id="title">
<h1>購物車頁面</h1>
</div>
<div id="cart-content">
<table>
<thead>
<tr>
<th>商品名稱</th>
<th>數(shù)量</th>
<th>價(jià)格</th>
</tr>
</thead>
<tbody>
<tr>
<td>可愛的小熊玩具</td>
<td>1</td>
<td>59元</td>
</tr>
</tbody>
</table>
<p><a href="#" class="add-to-cart-btn">繼續(xù)購物</a></p>
</div>
</body>
</html>