语义 UI 页面网格

Semantic UI 是一个现代框架，用于为网站开发无缝设计，它为用户提供了轻量级的组件体验。它使用预定义的 CSS 和 jQuery 来整合不同的框架。

语义 UI 网格用于协调布局中的负空间。 Semantic UI Semantic-UI Page Grids 版本 1.X 用于包含容纳页面内容的网格的最大宽度。现在语义 UI 页面网格已被弃用，取而代之的是更简单的容器元素。

语义 UI 页面网格类：现在已弃用。与其使用页面网格，不如使用ui 网格容器在网格中包含顶级页面内容。

• 网格容器：该类用于设置网格容器。

句法：

  

   ....
  
  ....

示例 1：在本文中，我们将使用三列双层可堆叠网格容器作为 Page 网格的替代品。

HTML

    
    


    
        
GeeksforGeeks
        
            Semantic UI Page Grid Containers           
        
        

        

          

             
HTML
 
             
Hypertext Markup Language
 
          
          

             
CSS
 
             
Cascading Stylesheet
 
          
          

             
JS
             
             
JavaScript
 
          
       
    

输出：

语义 UI 页面网格

示例 2：在此示例中，我们将使用四列折叠可堆叠容器网格来代替带有彩色列标题的页面网格。由于它是四列容器，列似乎在左侧，最后一列似乎是空的。

HTML

    
    


    
        
GeeksforGeeks
        
            Semantic UI Page Grid Containers
        
     
        


        

          

            
HTML
 
             
Hypertext Markup Language
 
          
          

            
CSS
 
             
Cascading Stylesheet
 
          
          

            
JS
 
             
JavaScript
 
          
        
    

输出：

语义 UI 页面网格

参考： https://semantic-ui.com/collections/grid.html#page-grids