<div class="bubble">热</div>
.bubble {
position: absolute;
top: -15px;
right: -15px;
width: 22px;
height: 15px;
line-height: 15px;
font-size: 1px;
font-weight: 400;
color: #fff;
text-align: center;
background-image:linear-gradient(to top,#FF2900,#FF923F);
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 4px;
}
.bubble:before {
position: absolute;
content: "";
width: 0;
height: 0;
left: 5px;
bottom: -6px;
border-left: 3px solid transparent;
border-top: 6px solid #FF2900;
border-right: 3px solid transparent;
}