幽灵酒吧

Spectre Bars用于表示任务的进度，已知范围内的值。条是用于显示 HTML5 、 和输入范围元素的组件。

在 Spectre Bars 中，我们有默认条和滑块，Spectre Slider Bars 用于在滑块模式下创建进度条。您可以将bar-slider类添加到 Bars 容器中。使用bar-item类添加子元素，并使用类bar-item为 div 内的按钮添加类bar-slider-btn 。您还需要手动添加bar-item宽度以设置滑块点。

幽灵酒吧类型：

• Spectre 默认条：用于创建普通条。
• 幽灵滑块： 这些用于在滑块模式下创建进度条。

幽灵酒吧类：

• bar：这个类用于创建默认的 bar 和 slide bar。
• bar-slider：此类用于创建滑块。

句法：

下面的示例说明了幽灵条。

示例 1：

HTML

  

    
    
    
    

  

    
        
GeeksforGeeks
        SPECTRE Bars Class
    
    

    Slider Bars:
    

        

        
        

        
    
    

    Slider Bars:
    

        

        
    

  

输出：

示例 2：在此示例中，我们将创建滑块。

HTML

  

    
    
    
    

  

    
        
GeeksforGeeks
        SPECTRE Slider bars Class
    
    

    Range Slider Bars:
    

        

            
                
Minimum
            
        
        

            
                
Maximum
            
        
    
    

    Slider Bars:
    

        

            
                
75%
            
        
    

  

输出：

参考： https://picturepan2.github.io/spectre/components/bars.html