网上书店html静态页面
时间: 2023-12-26 11:28:27 浏览: 49
根据提供的引用内容,以下是一个简单的网上书店的HTML静态页面的示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>网上书店</title>
<style>
/* CSS样式 */
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
nav {
background-color: #666;
color: #fff;
padding: 10px;
text-align: center;
}
section {
background-color: #fff;
padding: 20px;
margin: 10px;
}
footer {
background-color: #333;
color: #fff;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>网上书店</h1>
</header>
<nav>
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">图书分类</a></li>
<li><a href="#">购物车</a></li>
<li><a href="#">联系我们</a></li>
</ul>
</nav>
<section>
<h2>热门图书</h2>
<ul>
<li>图书1</li>
<li>图书2</li>
<li>图书3</li>
</ul>
</section>
<section>
<h2>新书推荐</h2>
<ul>
<li>图书4</li>
<li>图书5</li>
<li>图书6</li>
</ul>
</section>
<footer>
版权所有 © 2021 网上书店
</footer>
</body>
</html>
```
相关推荐
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)