[CSS] tạo ô khuyến mãi đẹp như ví dụ bên dướiMã html
<div class="khuyen-mai-hb">
<span class="tieu-de"><i class="icon-gift"></i> Khuyến mãi đặc biệt</span>
<ul>
<li>Giảm 30% khi đăng ký hosting 3 năm</li>
<li>Giảm 10% phí dịch vụ khi like và share website</li>
<li>Tặng 1 khóa học viết bài chuẩn SEO online</li>
</ul>
</div>
Css
.khuyen-mai-hb {
margin-bottom:2px;
margin-top:2px;
background:white;
padding:10px;
border-radius:5px;
border:1px solid #ef0b0b;
font-size:15px;
width:100%;
}
.khuyen-mai-hb .tieu-de {
background:#e31616;
padding:2px 20px;
margin-top:-24px;
font-size:15px;
font-weight:500;
color:#ffffff;
display:block;
max-width:207px;
border-radius:99px;
}
.khuyen-mai-hb ul {
margin-bottom:4px;
list-style-image:url(tick.png);
}
Khuyến mãi đặc biệt
- Giảm 30% khi đăng ký hosting 3 năm
- Giảm 10% phí dịch vụ khi like và share website
- Tặng 1 khóa học viết bài chuẩn SEO online
