Spectre Tables Scrollable tables

Last Updated : 30 Jan, 2022

Tables are important elements of web development society. If you want to display some data then you will definitely require tables. Spectre tables are the same as HTML tables, here we will discuss the Spectre Scrollable tables.

Tables Scrollable tables Class:

table-scroll: This class is used to create the table row vertically scroll-able.

Syntax:

<table class="table table-scroll">
  .....
</table>

Example:

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title>SPECTRE Tables Scrollable tables Class</title> 
    <link rel="stylesheet" 
          href= 
"https://unpkg.com/spectre.css/dist/spectre.min.css"> 
    <link rel="stylesheet" 
          href= 
"https://unpkg.com/spectre.css/dist/spectre-exp.min.css"> 
    <link rel="stylesheet" 
          href= 
"https://unpkg.com/spectre.css/dist/spectre-icons.min.css"> 
</head> 
  
<body> 
    <center> 
        <h1 class="text-success">GeeksforGeeks</h1> 
        <strong>SPECTRE Tables Scrollable tables Class</strong> 
        <br> 
        <table class="table table-striped table-scroll"> 
            <thead> 
                <tr> 
                    <th>Name</th> 
                    <th>Technology</th> 
                    <th>Online Date</th> 
                    <th>Mentor</th> 
                    <th>Duration</th> 
                </tr> 
            </thead> 
            <tbody> 
                <tr> 
                    <td>The fundamentals of Web</td> 
                    <td>HTML, CSS & JS</td> 
                    <td>14 feb 2022</td> 
                    <td>S.K Ladh IIT-Kanpur</td> 
                    <td>2 Month</td> 
                </tr> 
                <tr> 
                    <td>Design of Web</td> 
                    <td>Bootstrap & Tailwind</td> 
                    <td>14 June 2022</td> 
                    <td>Sayan Mukherjee IIT-Kharaghpur</td> 
                    <td>1 Month 10 Days</td> 
                </tr> 
                <tr> 
                    <td>Hard part of Web</td> 
                    <td>Node.js & HTTP</td> 
                    <td>14 Nov 2022</td> 
                    <td>Sandeep Jain IIT-Roorkee</td> 
                    <td>2 Month</td> 
                </tr> 
            </tbody> 
        </table> 
    </center> 
</body> 
  
</html>