Tables

Last edited 01/20/2020

There are many uses for tables, and Tentaroo makes it easy to display your table data in an eye-catching, mobile-responsive format. Below, we have two different classes of tables - tentaroo1 is built with a red motif and tentaroo2 is a brownish grey motif. We may be adding additional styles in the future.

ID First Name Last Name
235312 John Doe
453123 Mark Jones
998332 Jonathan Smith
345612 Andrew McArthur
453123 Adam Fuller
998332 Tyler Watt

 

Use class="tentaroo1"

 

ID First Name Last Name
235312 John Doe
453123 Mark Jones
998332 Jonathan Smith
345612 Andrew McArthur
453123 Adam Fuller
998332 Tyler Watt

 

Use class="tentaroo2"

 

ID First Name Last Name
235312 John Doe
453123 Mark Jones
998332 Jonathan Smith
345612 Andrew McArthur
453123 Adam Fuller
998332 Tyler Watt

 

Use class="tentaroo3"

 

ID First Name Last Name
235312 John Doe
453123 Mark Jones
998332 Jonathan Smith
345612 Andrew McArthur
453123 Adam Fuller
998332 Tyler Watt

 

Use class="tentaroo4"

 

ID First Name Last Name
235312 John Doe
453123 Mark Jones
998332 Jonathan Smith
345612 Andrew McArthur
453123 Adam Fuller
998332 Tyler Watt

 

Use class="tentaroo5"

 

Here is the sample for code:

<table class="tentaroo1">
    <thead>
        <tr>
            <th>ID</th>
            <th>First Name</th>
            <th>Last Name</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td><a href="#">235312</a></td>
            <td>John</td>
            <td>Doe</td>
        </tr>
        <tr>
            <td>453123</td>
            <td>Mark</td>
            <td>Jones</td>
        </tr>
        <tr>
            <td>998332</td>
            <td>Jonathan</td>
            <td>Smith</td>
        </tr>
        <tr>
            <td>345612</td>
            <td>Andrew</td>
            <td>McArthur</td>
        </tr>
        <tr>
            <td>453123</td>
            <td>Adam</td>
            <td>Fuller</td>
        </tr>
        <tr>
            <td>998332</td>
            <td>Tyler</td>
            <td>Watt</td>
        </tr>
    </tbody>
</table>

We are always happy to assist with website training.