優惠券是商家提供的一種銷售促進方式，可以吸引顧客前來消費。在電商平臺上，優惠券圖片的設計尤為重要，而CSS技術可以為優惠券圖片的呈現提供很好的支持。

.coupon {
border: 1px solid #ccc;
padding: 10px;
background-color: #fff;
width: 200px;
height: 100px;
border-radius: 10px;
box-shadow: 2px 2px 5px #ccc;
position: relative;
}
.coupon::before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 30px 30px;
border-color: transparent transparent #ff0000 transparent;
}
.coupon::after {
content: "";
position: absolute;
right: -10px;
top: 10px;
width: 0;
height: 0;
border-style: solid;
border-width: 0 10px 10px 0;
border-color: transparent #fff transparent transparent;
}
.coupon .code {
font-size: 20px;
color: #fff;
background-color: #ff0000;
border-radius: 5px;
padding: 5px 10px;
position: absolute;
top: 10px;
left: 10px;
}
.coupon .discount {
font-size: 30px;
font-weight: bold;
color: #ff0000;
position: absolute;
top: 30px;
left: 20px;
}
.coupon .title {
font-weight: bold;
font-size: 18px;
color: #333;
position: absolute;
bottom: 20px;
left: 20px;
}

以上代碼實現了一個優惠券的基本樣式，其中偽元素::before和::after設置了券面的角落和右側的懸浮元素。同時使用了CSS3的box-shadow屬性和border-radius屬性讓樣式更加美觀。

優惠券包含了優惠碼、折扣數字和標題等內容，均采用絕對定位方式放置在券面上。代碼中使用了顏色和字體大小的設置等來創造更加吸引人的視覺效果。

CSS技術為優惠券圖片的設計提供了很大的靈活性，可以實現各種不同的樣式，更好地吸引顧客的注意力，提高銷售效果。