京东秒杀价格标签
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}
i {
font-style: normal;
}
.price {
width: 158px;
height: 24px;
border: 1px solid red;
background-color: red;
line-height: 24px;
margin: 20px auto;
text-align: center;
}
.dazhe {
position: relative;
float: left;
width: 92px;
height: 24px;
font-size: 14px;
font-weight: 700;
}
.dazhe::after {
position: absolute;
top: 0;
right: -1px;
content: "";
width: 0;
height: 0;
border-width: 24px 8px 0 0;
border-color: transparent #fff transparent transparent;
border-style: solid;
}
.yuanjia {
float: right;
background-color: #fff;
font-size: 14px;
color: #999;
text-decoration: line-through;
}
</style>
</head>
<body>
<div class="price">
<div class="dazhe">
<i>$</i>
<span>688.00</span>
</div>
<div class="yuanjia">
<i>$</i>
<span>2888.00</span>
</div>
</div>
</body>
</html>
