隨著互聯網的飛速發展，電子商務成為了人們生活中不可或缺的一部分。為了吸引更多的消費者，商家經常會在特定時間推出優惠活動。那么如何利用純CSS3實現一個優惠券效果呢？

.coupon{
background-color: #fff;
border: 3px dashed #000;
padding: 20px;
width: 300px;
height: 120px;
border-radius: 10px;
text-align: center;
box-shadow: 0 0 20px rgba(0,0,0,0.5);
position: relative;
}
.coupon::before{
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 15px 15px 0;
border-color: transparent #000 transparent transparent;
position: absolute;
top: -15px;
left: 15px;
}
.coupon::after{
content: "10% OFF";
color: #fff;
font-size: 24px;
font-weight: bold;
position: absolute;
top: -55px;
left: -30px;
width: 120px;
height: 120px;
background-color: #000;
transform: rotate(-45deg);
line-height: 120px;
}

通過以上的CSS代碼，我們就可以實現一個簡單的優惠券效果。通過.box進行樣式的設置，::before和::after偽元素用于設置優惠券三角形與優惠券文字樣式。

值得一提的是，以上效果只是一個基礎的優惠券樣式，實現優惠券效果還可以通過偽類的選擇器進行更加自由的樣式設置。