微信小程序上，实现图片右上角数字显示

微信小程序上，实现图片右上角数字显示

直接上代码：

样式代码index.wxss如下：

.circle_rednum {
  position: absolute;
  color: white;
  font-size: 13px;
  background-color: #EC2F43;
  width: 23px;
  height: 23px;
  line-height: 23px;
  left: 80%;
  top: -2px;
  text-align: center;
  -webkit-border-radius: 24px;
  border-radius: 24px;
}

前端代码index.wxml如下：

        
          
            
            
{{floatNewNum}}
            
99+
          
          新工单
        

微信小程序的效果为：

 再分享一个html版本的css右上角显示带数字的圆圈的代码

    
        
        
        
    
    
        

            
            

                3
            
        
    

效果如下：