如何使用 jQuery EasyUI Mobile 为手机设计徽章？

EasyUI 是一个 HTML5 框架，用于使用基于 jQuery、React、Angular 和 Vue 技术的用户界面组件。它有助于为交互式 Web 和移动应用程序构建功能，为开发人员节省大量时间。

在本文中，我们将了解移动界面的徽章。徽章是与链接相关联的数字，用于指示与链接相关联的项目数。

EasyUI for jQuery 下载：

https://www.jeasyui.com/download/index.php

在移动应用程序的代码中实现时，请注意预编译文件的文件路径。

示例 1：以下示例演示了使用 EasyUI框架的移动应用程序的一些基本徽章。

html

  

    
    
  
    
    
  
    
  
    
  
    
    
    
  
    
    
    
  
    
    

  

    
  
        
  
        
            
                Badge 1
                3
            
        
        
            
                Badge 2
                4
            
            
                Badge 3
                5
            
        
        
            
                Badge Attr
            
        
    

  

输出：

示例 2：以下示例演示了使用 EasyUI框架的移动应用程序的列表和页脚标志。

html

  

    
    
  
    
    
      
    
      
    
      
    
      
    
    
    
      
    
    
    
      
    
    

  

    
        
            
                
                    List and Footer Badges
                
            
        
  
        
        
            Mobile App
                
                    
                        234
                    
                
            
  
            Web Design
                
                    12
                    
                
            
            IoT
                
                    6
                    
                
            
        
  
        
        
            
                
                    Photos
                
                  
                
                    Artwork
                
                  
                
                    Shapes
                    
                        25
                    
                
  
                
                    SmartArt
                
            
        
    

  

输出：

示例 3：以下示例演示了选项卡徽章。

html

  

    
    
  
    
    
  
    
  
    
  
    
  
    
    
  
    
    
    
  
    
    
      
    
        .tab-class {
            padding-top: 6px;
            position: relative;
            display: inline-block;
            line-height: 12px;
        }
  
        p {
            line-height: 150%;
        }
    

  

    
        
            
                
                    Tab Badges
                
            
        
        
        
  
            
            
                
                    
                    13
                
  
                
                    HTML stands for HyperText Markup Language.
                    It is used to design web pages using a
                    markup language. HTML is the combination 
                    of Hypertext and Markup language. Hypertext 
                    defines the link between the web pages.
                    A markup language is used to define the 
                    text document within tag which defines the 
                    structure of web pages..
                
            
  
            
                
                    
                    14
                
  
                
                    Cascading Style Sheets, fondly referred to 
                    as CSS, is a simply designed language 
                    intended to simplify the process of making 
                    web pages presentable. CSS allows you to 
                    apply styles to web pages. More importantly,
                    CSS enables you to do this independent of 
                    the HTML that makes up each web page.
                
            
  
            
                
                    
                    15
                
  
                
                    The term PHP is an acronym for PHP: 
                    Hypertext Preprocessor. PHP is a server-side 
                    scripting language designed specifically
                    for web development. PHP can be easily 
                    embedded in HTML files and HTML codes can 
                    also be written in a PHP file.
                
            
        
    

  

输出：