简单购物网页 HTML 源码示例 - 免费下载
以下是一个简单的购物网页的示例源码:
<!DOCTYPE html>
<html>
<head>
<title>购物网页</title>
<link rel='stylesheet' type='text/css' href='style.css'>
</head>
<body>
<header>
<h1>购物网页</h1>
</header>
<section id='products'>
<div class='product'>
<img src='product1.jpg' alt='商品1'>
<h3>商品1</h3>
<p>$10</p>
<button>加入购物车</button>
</div>
<div class='product'>
<img src='product2.jpg' alt='商品2'>
<h3>商品2</h3>
<p>$20</p>
<button>加入购物车</button>
</div>
<div class='product'>
<img src='product3.jpg' alt='商品3'>
<h3>商品3</h3>
<p>$30</p>
<button>加入购物车</button>
</div>
</section>
<section id='cart'>
<h2>购物车</h2>
<ul>
<li>商品1 - $10</li>
<li>商品2 - $20</li>
<li>商品3 - $30</li>
</ul>
<p>总价: $60</p>
</section>
<script src='script.js'></script>
</body>
</html>
将上述代码保存为名为index.html的 HTML 文件。请注意,这只是一个简单的示例,其中的图片和样式表都需要根据实际情况进行替换和自定义。
此外,你也可以通过使用 CSS 样式表(style.css) 和 JavaScript 脚本(script.js) 来进一步定制和增强购物网页的功能和外观。
原文地址: https://www.cveoy.top/t/topic/iHm 著作权归作者所有。请勿转载和采集!