📌  相关文章
📜  基础 CSS 滚动表

📅  最后修改于: 2022-05-13 01:56:16.109000             🧑  作者: Mango

基础 CSS 滚动表

Foundation CSS是由 ZURB 于 2011 年 9 月创建的开源和响应式前端框架，可以轻松创建可在任何设备上运行的令人惊叹的响应式网站、应用程序和电子邮件。许多公司，如 Facebook、eBay、Mozilla、Adobe，甚至迪士尼，都在使用它。该框架基于bootstrap，类似于SaaS。它更加复杂、通用且可配置。它还带有一个命令行界面，使其易于与模块捆绑器一起使用。电子邮件框架为您提供响应式 HTML 电子邮件，可以在任何设备上阅读。 Foundation for Apps 允许您构建完全响应的 Web 应用程序。

Foundation CSS Tables用于以行和列的形式排列表格数据。我们可以使用行和列轻松获取任何表值。滚动表可以在我们的表中进行水平滚动。要启用滚动，请将.table-scroll类添加到元素。在本文中，我们将讨论 Foundation CSS 滚动表。

基础 CSS 滚动表类：

  • table-scroll：该类用于启用表格中的水平滚动。

句法： 


   ...

示例 1：以下代码演示了 Foundation CSS 滚动表。

HTML


  

  Foundation CSS Scrolling Table
  
  

  

  

    

      GeeksforGeeks
    

      
    
Foundation CSS Scrolling Table

  
    

      
        
          
            
            
            
            
            
            
            
            
            
            
            
            
            
          
        
        
          
            
            
            
            
            
            
            
            
            
            
            
            
            
          
          
            
            
            
            
            
            
            
            
            
            
            
            
            
          
        
      
GFG 1GFG 2GFG 3GFG 4GFG 5GFG 6GFG 7GFG 8GFG 9GFG 10GFG 11GFG 12GFG 13
C++GeeksforGeeks1DartJavaGFGGeeksforGeeks2GeeksforGeeks3GeeksforGeeks4GeeksforGeeks5GeeksforGeeks6GeeksforGeeks7GeeksforGeeks8GeeksforGeeks9
Data StructureCodingGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeksGeeksforGeeks

    

  

HTML


  

  Foundation CSS Scrolling Table
    
  

  

  

    

      GeeksforGeeks
    

      
    
Foundation CSS Scrolling Table

  
    

      
        
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
        
        
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
        
      
GFG 1GFG 2GFG 3GFG 4GFG 5GFG 6GFG 7GFG 8GFG 9GFG 10GFG 11GFG 12GFG 13GFG 14GFG 15
C++GeeksforGeeks1GFGGeeksforGeeksGeeksforGeeksGeeksforGeeks2GeeksforGeeks1GeeksforGeeks4GFGGeeksforGeeks6GeeksforGeeks7GeeksforGeeksGeeksforGeeks9GeeksforGeeks9
Data StructureGFG LinkGeeksforGeeksGeeksforGeeksGFGGeeksforGeeksGeeksforGeeksGeeksforGeeksOpen GFGGeeksforGeeksGeeksforGeeksLink GfgGeeksforGeeksGeeksforGeeksGeeksforGeeks
PythonButtonGeeksforGeeks.orgGeeksforGeeks.orgFlutterGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.org

    

  

输出：

基础 CSS 滚动表

基础 CSS 滚动表

示例 2：以下代码演示了带有链接、按钮、更多行和更多列的 Foundation CSS 滚动表。

HTML 



  

  Foundation CSS Scrolling Table
    
  

  

  

    

      GeeksforGeeks
    

      
    
Foundation CSS Scrolling Table

  
    

      
        
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
        
        
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
          
            
            
            
            
            
            
            
            
            
            
            
            
            
            
          
        
      
GFG 1GFG 2GFG 3GFG 4GFG 5GFG 6GFG 7GFG 8GFG 9GFG 10GFG 11GFG 12GFG 13GFG 14GFG 15
C++GeeksforGeeks1GFGGeeksforGeeksGeeksforGeeksGeeksforGeeks2GeeksforGeeks1GeeksforGeeks4GFGGeeksforGeeks6GeeksforGeeks7GeeksforGeeksGeeksforGeeks9GeeksforGeeks9
Data StructureGFG LinkGeeksforGeeksGeeksforGeeksGFGGeeksforGeeksGeeksforGeeksGeeksforGeeksOpen GFGGeeksforGeeksGeeksforGeeksLink GfgGeeksforGeeksGeeksforGeeksGeeksforGeeks
PythonButtonGeeksforGeeks.orgGeeksforGeeks.orgFlutterGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.orgGeeksforGeeks.org

    

  

输出：

基础 CSS 滚动表

基础 CSS 滚动表

参考： https://get.foundation/sites/docs/table.html#scrolling-table