📜  Semantic-UI Progress 进度内容

📅  最后修改于: 2022-05-13 01:56:15.468000             🧑  作者: Mango

Semantic-UI Progress 进度内容

Semantic UI是一个开源开发框架,它提供了预定义的类,使我们的网站看起来漂亮、令人惊叹且响应迅速。它类似于具有预定义类的 Bootstrap。它使用 jQuery 和 CSS 来创建接口。它也可以像 bootstrap 一样通过 CDN 直接使用。

进度条指示完成的工作在总工作中的进度。它直观地指示使用条形完成的工作量。在本文中,我们将了解Progress Progress Content 类型。此内容类型指示进度条上的工作进度。

语义 UI 进度进度内容类:

  • progress:该类表示工作的进度。

句法:

...

示例1:以下代码演示了progress 内容类型的进度条。

HTML


  

    
    
    

  

    
        

Geeksforgeeks

                     Semantic-UI Progress Progress Content Type              
    
        
            
                
            
            
Transferring files
        
    
         


HTML


  

    
    
    

  

    
        

GeeksforGeeks

                     Semantic-UI Progress Progress Content Type              
    
        
            
                
            
            
Transferring files
        
        
Upload file-1
        
Upload file-2
        
Upload file-3
    
       


输出:

Semantic-UI Progress 进度内容

Semantic-UI Progress 进度内容

示例 2:以下代码用一些 javascript 演示了进度内容类型的进度条。

HTML



  

    
    
    

  

    
        

GeeksforGeeks

                     Semantic-UI Progress Progress Content Type              
    
        
            
                
            
            
Transferring files
        
        
Upload file-1
        
Upload file-2
        
Upload file-3
    
       

输出:

Semantic-UI Progress 进度内容

Semantic-UI Progress 进度内容

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