如何设置Bootstrap 4滚动到长粘性侧边栏的底部？

• 在自举3，组引导滚动到长粘侧边栏底部可能使用词缀其由“词缀jQuery插件”处理。
• 不幸的是，在Bootstrap 4迁移中，删除了“ Affix jQuery插件”。
• 为了实现类似于Bootstrap 3的附加属性， Bootstrap 4向我们推荐CSS属性，即position：sticky;直接风格或执行位置：粘性；在@supports规则上。
• 尽管不一定在所有情况下都支持position：sticky ，但我们可以采用第三方ScrollPos-Styler库。

示例1：下面的示例说明如何使用CSS属性将Bootstrap 4滚动设置到长杆侧边栏的底部。

  

    
    
    
    
    
    
    
    
        .sidebar {
            top: 50px;
            left: 0px;
            position: sticky;
        }
    

  

  
    
    
        
    
    
    
        
            
                
                    
                    
                        Sticky sidebar
                        Bootstrap 4
                        See Features
                    
                
                
                
  
                    
                
                
  
            
            
                
GeeksforGeeks
                 Bootstrap is a free and open-source tool collection
              for creating responsive websites and web applications. 
              It is the most popular HTML, CSS, and JavaScript framework
              for developing responsive, mobile-first web sites. 
              Nowadays, the websites are perfect for all the browsers 
              (IE, Firefox and Chrome) and for all sizes of screens 
              (Desktop, Tablets, Phablets, and Phones). 
              All thanks to Bootstrap developers – Mark Otto and
              Jacob Thornton of Twitter, though it was later declared 
              to be an open-source project.
                
                 Bootstrap is a free and open-source tool collection
              for creating responsive websites and web applications.
              It is the most popular HTML, CSS, and JavaScript framework
              for developing responsive, mobile-first web sites. 
              It solves many problems which we had once, one of which is
              the cross-browser compatibility issue. Nowadays, the websites
              are perfect for all the browsers (IE, Firefox and Chrome) and
              for all sizes of screens (Desktop, Tablets, Phablets, and Phones).
              All thanks to Bootstrap developers -Mark Otto and Jacob Thornton 
              of Twitter, though it was later declared to be an open-source project.
                
                 Why Bootstrap?
                
                
                
                    Faster and Easier Web-Development.
                    It creates Platform-independent web-pages.
                    It creates Responsive Web-pages.
                    It designed to be responsive to mobile devices too.
                    It is Free! Available on www.getbootstrap.com
                
                How to use Bootstrap 4 in webpage:
              There are two ways to include Bootstrap in the website.
            
        
    

  

    $(document).ready(function() {
        $("#filter").on("keyup", function() {
            var value = $(this).val().toLowerCase();
            $("#body *").filter(function() {
                $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
            });
        });
    });

  

输出：

参考https://getbootstrap.com/docs/4.3/migration/#components