Semantic-UI Rail Attached 变体

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

Rails是向用户显示附加内容的绝佳方式，通常它们用于显示广告。它们放置在主视口的左侧或右侧，默认宽度为 300 像素。为了使语义轨起作用，主容器的宽度应在 600 像素到 800 像素之间。 Rails 可以使用附加类附加到主视口。

语义 UI Rail 附加的变体类：

• 左：将导轨定位到视口的左侧。
• 右：将导轨定位到视口的右侧。
• 附加：将轨道附加到视口。

句法：

    

        ...
    
    ...

示例 1：在下面的示例中，我们将左侧栏杆附加到主视口。

HTML

  

    Semantic UI Rail Attached Variation
    
  
    
    
  
    
    

  

  
    
        GeeksForGeeks
        Semantic UI Rail Attached Variation
        
        
        
            
                
                    This is a small rail attached 
                    to the main viewport.
                
            
              
Main Viewport
  
              
Main Viewport
  
        
    

  

输出：

将左导轨连接到主视口

示例 2：在下面的示例中，我们已将右侧栏杆附加到主视口。

HTML

  

    Semantic UI Rail Attached Variation
    
  
    
    
  
    
    

  

  
    
        GeeksForGeeks
        Semantic UI Rail Attached Variation
        
        
        
            
                
                    This is a tiny rail attached 
                    to the main viewport.
                
            
            Main Viewport
            Main Viewport
        
    

  

输出：

将右导轨连接到主视口

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