语义-UI 分隔符变体

Semantic UI 是一个免费的开源前端开发框架，配备了预构建的语义组件，有助于使用用户友好的 HTML 创建响应式布局。它使用预定义的 CSS 和 jQuery 来整合不同的框架。

分隔符通常用于将内容简洁地划分为不同的部分。语义 UI 有 3 种不同类型的分隔符，它们可以有 5 种不同的变体，如下所示。在本文中，让我们讨论语义 UI 中支持的水平分隔符类型的不同分隔符变体。

Semantic-UI Divider Variations：正如我们在上一段中提到的，我们有三种类型的分隔符，每种类型都有固定的 5 个分隔符变体。

• 反转：反转变化会将原始颜色反转为直接相反的颜色。
• 合身：合身变体将适合分隔器，而不会在上方和下方留出空间。
• 隐藏：隐藏变体创建隐藏的分隔线。
• 部分：部分变化 给 大的边距来划分网页内容的各个部分。
• 清算：清算变化 清除分隔线上方的内容。

句法：

    ...

下面的示例说明了 Semantic-UI Divider Variations：

示例 1：

HTML

    

    
    
  

    
GeeksforGeeks
    Semantic-UI Divider Variations
    


    Inverted Divider:
    

      

        Semantic UI is a free open-source front-end
        development framework that is equipped with 
        pre-built semantic components that helps create
        responsive layouts using user-friendly HTML.  
        It uses predefined CSS and jQuery to incorporate
        different frameworks. 
      
  
      

      

        Semantic UI is a free open-source front-end
        development framework that is equipped with 
        pre-built semantic components that helps create
        responsive layouts using user-friendly HTML.  
        It uses predefined CSS and jQuery to incorporate
        different frameworks.
      
    
    Fitted Divider:
    

      Geeksforgeeks
      

          We provide a variety of services for you to learn,
        thrive and also have fun!
      
    
  

输出：

语义-UI 分隔符变体

示例 2：

HTML

    

    
    
  

    
GeeksforGeeks
    Semantic-UI Divider Variations
    


    

    Hidden Divider:
    

    GeeksforGeeks
    

      Free Tutorials, Millions of Articles, Live, 
      Online and Classroom Courses ,Frequent Coding 
      Competitions ,Webinars by Industry Experts,
      Internship opportunities and Job Opportunities.
    
  
    

    Geeks Portal
    

      Free Tutorials, Millions of Articles, Live, 
      Online and Classroom Courses ,Frequent Coding 
      Competitions ,Webinars by Industry Experts,
      Internship opportunities and Job Opportunities.
    
  
    

    Section Divider:
    

    GeeksforGeeks
    

      Free Tutorials, Millions of Articles, Live, 
      Online and Classroom Courses ,Frequent Coding 
      Competitions ,Webinars by Industry Experts,
      Internship opportunities and Job Opportunities.
    
  
    

    Geeks Portal
    

      Free Tutorials, Millions of Articles, Live, 
      Online and Classroom Courses ,Frequent Coding 
      Competitions ,Webinars by Industry Experts,
      Internship opportunities and Job Opportunities.
    
  
    

    Clearing Divider:
    

    

      
        Geeks Portal
      
      

      

        Free Tutorials, Millions of Articles, Live, 
        Online and Classroom Courses ,Frequent Coding 
        Competitions ,Webinars by Industry Experts,
        Internship opportunities and Job Opportunities.
      
    
  

输出：

参考： https://semantic-ui.com/elements/divider.html