纯css实现导航处hot小图标实现

先上效果图：

纯css实现导航处hot小图标实现

css代码：

.shop{
position: relative;
}
.shop a:after{
background-color: red;
border-radius: 3px;
color: #fff;
content: "hot";
font-size: 10px;
line-height: 1;
padding: 1px 3px;
position: absolute;
right: -8px;
top: 10px;
}
代码控制区域：

纯css实现导航处hot小图标实现

通常状况下很多的这种小图标使用的小图片，这里直接写入css彻底控制。其中hot字样能够改成其余文字，在css的content中修改。

本文连接：https://www.weguiding.com/css/433.html