Semantic-UI 手风琴变奏

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

语义 UI 手风琴变体用于创建具有不同变体的手风琴。语义 UI 手风琴提供以下变体。

Semantic-UI Accordion Variation 类：

• 流体：这个类用于创建一个可以占据其容器宽度的手风琴。
• 倒置：此类用于格式化以显示在深色背景上。

句法：

   ....

示例 1：以下代码演示了 Semantic UI流体手风琴变体。

HTML

    
        
        
        
    
    
        
            
GeeksforGeeks
            Semantic UI Variations Accordion
        
        


        Accordion Variations:
        

          

            
            GeeksforGeeks
          
          

            

             GeeksforGeeks is a computer science portal.
             It is the best platform to lean programming.
            
  
          
          

            
            Semantic UI
          
          

            

             Semantic UI is a modern framework used in 
             developing seamless designs for the website,
             It gives the user a lightweight experience 
             with its components. It uses the predefined 
             CSS and jQuery to incorporate in different 
             frameworks.
            
  
          
          

            
            HTML
          
          

            

              HTML stands for HyperText Markup Language. 
              It is used to design web pages using markup
              language.
            
  
          
        
    

输出：

Semantic-UI 手风琴变奏

示例 2：以下代码演示了 Semantic UI倒置手风琴变体。

HTML

    
    
    


   
       
Geeksforgeeks
       Semantic UI Inverted accordion variation
   
   


     Inverted Accordion Variant:
   

     

       

         
         GeeksforGeeks 
       
       

         

             GeeksforGeeks is a computer science portal.
             It is the best platform to lean programming.
         
  
       
       

         
         Semantic UI
       
       

         
...
       
       

         
         HTML
       
       

         
...
       
   
   

输出：

Semantic-UI 手风琴变奏

参考链接： https://semantic-ui.com/modules/accordion.html