Semantic-UI 进度指示类型

Semantic UI 是一个开源框架，它使用 CSS 和 jQuery 构建出色的用户界面。它与使用的引导程序相同，并且有很多不同的元素可用于使您的网站看起来更令人惊叹。

语义 UI 进度允许用户显示任务的进度。 Semantic UI Progress 为我们提供了 2 种类型、3 种内容、5 种状态和 5 种变体。

在本文中，我们将了解指示类型。 Semantic UI Progress Indicating Type 用于创建指示进度条，直观地指示指定任务的当前进度级别。

语义 UI 进度指示类型类：

• 指示：该类用于创建指示进度条，直观地指示指定任务的当前进度级别。

句法：

     
...
     
...

示例 1：以下示例说明了语义 UI 进度指示类型。

HTML

  

    
    
    
    
    

  

    
        Geeksforgeeks
        
            Semantic-UI Progress Indicating Type
        
    
    
        
            
                
                    
                
                Progressing
            
        
    
    
        $('#eg').progress();
    

  

输出：

Semantic-UI 进度指示类型

示例 2：下面的代码演示了带有data-value和data-total属性和增量参数的指示进度类。

HTML

  

    
    
    
    
    

  

    
        GeeksforGeeks
        
            Semantic-UI Progress Indicating Type
        
    
    
        
            
                
                    
                
                Progressing
            
        
        Increase
    
    
        $('.ui.button').on('click', function () {
            $('.progress').progress('increment');
        });
    

  

输出：

Semantic-UI 进度指示类型

参考： https://semantic-ui.com/modules/progress.html#indicating