What's new announcement?

Today

Big News

2 min ago

Able Pro is Redesigned

Able Pro is completely renowed with high aesthetics User Interface.

img
Check Now
Offer

2 hour ago

Able Pro is in best offer price

Download Able Pro exclusive on themeforest with best price.

img

Yesterday

Blog

12 hour ago

Featured Dashboard Template

Do you know Able Pro is one of the featured dashboard template selected by Themeforest team.?

img
Announcement

12 hour ago

Buy Once - Get Free Updated lifetime

Get the lifetime free updates once you purchase the Able Pro.

img

DataTable Styling

DataTables

DataTables is a Javascript HTML table enhancing library. It is a highly flexible tool, built upon the foundations of progressive enhancement, that adds all of these advanced features to any HTML table.

Reference
Base Style
The DataTables default style file has a number of features which can be enabled based on the class name of the table
NamePositionOfficeAgeStart dateSalary
Airi SatouAccountantTokyo332008/11/28$162,700
Angelica RamosChief Executive Officer (CEO)London472009/10/09$1,200,000
Ashton CoxJunior Technical AuthorSan Francisco662009/01/12$86,000
Bradley GreerSoftware EngineerLondon412012/10/13$132,000
Brenden WagnerSoftware EngineerSan Francisco282011/06/07$206,850
Brielle WilliamsonIntegration SpecialistNew York612012/12/02$372,000
Caesar VancePre-Sales SupportNew York212011/12/12$106,450
Cedric KellySenior Javascript DeveloperEdinburgh222012/03/29$433,060
Charde MarshallRegional DirectorSan Francisco362008/10/16$470,600
Colleen HurstJavascript DeveloperSan Francisco392009/09/15$205,500
NamePositionOfficeAgeStart dateSalary
Showing 1 to 10 of 30 entries
No Styling Classes
This example shows the base DataTables style file being used, with none of the additional feature style classes being used.
NamePositionOfficeAgeStart dateSalary
Airi SatouAccountantTokyo332008/11/28$162,700
Angelica RamosChief Executive Officer (CEO)London472009/10/09$1,200,000
Ashton CoxJunior Technical AuthorSan Francisco662009/01/12$86,000
Bradley GreerSoftware EngineerLondon412012/10/13$132,000
Brenden WagnerSoftware EngineerSan Francisco282011/06/07$206,850
Brielle WilliamsonIntegration SpecialistNew York612012/12/02$372,000
Caesar VancePre-Sales SupportNew York212011/12/12$106,450
Cedric KellySenior Javascript DeveloperEdinburgh222012/03/29$433,060
Charde MarshallRegional DirectorSan Francisco362008/10/16$470,600
Colleen HurstJavascript DeveloperSan Francisco392009/09/15$205,500
NamePositionOfficeAgeStart dateSalary
Showing 1 to 10 of 30 entries
Base Style - Compact
The compact class reduces the amount of white-space in the default styling, increasing the information density on screen, as shown below.
NamePositionOfficeAgeStart dateSalary
Airi SatouAccountantTokyo332008/11/28$162,700
Angelica RamosChief Executive Officer (CEO)London472009/10/09$1,200,000
Ashton CoxJunior Technical AuthorSan Francisco662009/01/12$86,000
Bradley GreerSoftware EngineerLondon412012/10/13$132,000
Brenden WagnerSoftware EngineerSan Francisco282011/06/07$206,850
Brielle WilliamsonIntegration SpecialistNew York612012/12/02$372,000
Caesar VancePre-Sales SupportNew York212011/12/12$106,450
Cedric KellySenior Javascript DeveloperEdinburgh222012/03/29$433,060
Charde MarshallRegional DirectorSan Francisco362008/10/16$470,600
Colleen HurstJavascript DeveloperSan Francisco392009/09/15$205,500
NamePositionOfficeAgeStart dateSalary
Showing 1 to 10 of 30 entries
Base Style - Hover
This example shows DataTables with just the hover class specified. This class instructs DataTables' styling to highlight a row when the mouse is hovered over it.
NamePositionOfficeAgeStart dateSalary
Airi SatouAccountantTokyo332008/11/28$162,700
Angelica RamosChief Executive Officer (CEO)London472009/10/09$1,200,000
Ashton CoxJunior Technical AuthorSan Francisco662009/01/12$86,000
Bradley GreerSoftware EngineerLondon412012/10/13$132,000
Brenden WagnerSoftware EngineerSan Francisco282011/06/07$206,850
Brielle WilliamsonIntegration SpecialistNew York612012/12/02$372,000
Caesar VancePre-Sales SupportNew York212011/12/12$106,450
Cedric KellySenior Javascript DeveloperEdinburgh222012/03/29$433,060
Charde MarshallRegional DirectorSan Francisco362008/10/16$470,600
Colleen HurstJavascript DeveloperSan Francisco392009/09/15$205,500
NamePositionOfficeAgeStart dateSalary
Showing 1 to 10 of 30 entries
Settings
  • Theme Mode

    Choose light or dark mode or Auto

  • Theme Contrast

    Choose theme contrast

  • Custom Theme

    Choose your primary theme color

  • Theme layout

    Choose your layout

    img img img img img
  • Sidebar Caption

    Sidebar Caption Hide/Show

  • Theme Layout

    LTR/RTL

  • Layout Width

    Choose Full or Container Layout