Tablas Spectre Tablas desplazables

Las tablas son elementos importantes de la sociedad de desarrollo web. Si desea mostrar algunos datos, definitivamente necesitará tablas. Las tablas de Spectre son iguales a las tablas HTML, aquí discutiremos las tablas desplazables de Spectre.

Tablas Tablas desplazables Clase:

desplazamiento de la tabla: esta clase se utiliza para crear la fila de la tabla que se puede desplazar verticalmente.

Sintaxis:

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

Ejemplo:

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>

Producción:

Spectre Tables Scrollable tables

Referencia: https://picturepan2.github.io/spectre/elements/tables.html#tables-scroll

Publicación traducida automáticamente

Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

HTML

Deja una respuesta Cancelar la respuesta