HTML 图书促销活动代码
时间: 2024-05-02 19:14:08 浏览: 18
当然,我可以为您介绍一下HTML图书促销活动的代码。以下是一个简单的示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>图书促销活动</title>
<style>
.book {
display: inline-block;
width: 200px;
margin: 10px;
padding: 10px;
border: 1px solid #ccc;
text-align: center;
}
.book img {
width: 150px;
height: 200px;
}
.book h3 {
margin-top: 10px;
}
.book p {
margin-top: 5px;
}
.book button {
margin-top: 10px;
padding: 5px 10px;
background-color: #4CAF50;
color: white;
border: none;
cursor: pointer;
}
</style>
</head>
<body>
<div class="book">
<img src="book1.jpg" alt="Book 1">
<h3>书籍标题1</h3>
<p>作者:作者名</p>
<p>价格:$19.99</p>
<button>购买</button>
</div>
<div class="book">
<img src="book2.jpg" alt="Book 2">
<h3>书籍标题2</h3>
<p>作者:作者名</p>
<p>价格:$24.99</p>
<button>购买</button>
</div>
<div class="book">
<img src="book3.jpg" alt="Book 3">
<h3>书籍标题3</h3>
<p>作者:作者名</p>
<p>价格:$14.99</p>
<button>购买</button>
</div>
</body>
</html>
```
这段代码创建了一个简单的图书促销活动页面,其中包含了三本书的信息,包括书籍封面、标题、作者和价格,并且每本书都有一个购买按钮。