用css html帮我写一个优惠劵
时间: 2023-08-14 16:05:17 浏览: 59
好的,以下是一个简单的优惠券样式的代码示例,你可以根据自己的需求进行修改:
```html
<div class="coupon">
<div class="coupon-code">CODE12345</div>
<div class="coupon-description">Get 20% off on your next purchase</div>
<div class="coupon-expiry">Expires on 31st December 2021</div>
</div>
```
```css
.coupon {
border: 2px solid #ccc;
padding: 20px;
border-radius: 10px;
text-align: center;
font-family: Arial, sans-serif;
max-width: 300px;
margin: 0 auto;
}
.coupon-code {
font-size: 30px;
font-weight: bold;
color: #f00;
margin-bottom: 10px;
}
.coupon-description {
font-size: 18px;
margin-bottom: 10px;
}
.coupon-expiry {
font-size: 14px;
color: #888;
}
```
这段代码会生成一个带有优惠码、优惠描述和过期日期的优惠券。你可以根据需要修改字体、颜色、边框等属性。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.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)
![](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)