jQuery DataTables：如何改變分頁活動的顏色？

Question

我正在使用jQuery DataTables插件，並希望更改分頁的顏色。

使用CSS我想更改字體顏色，懸停字體顏色和活動頁面顏色。

的分頁代碼如下：

<script> 
$(document).ready(function() { 
    $.fn.dataTable.ext.errMode = 'none'; 
    var table = $('#users').DataTable({ 
    "columnDefs": [ 
     { "visible": false, "targets": 1 } 
     ], 
    "columns": [ 
     { "data": "user"}, 
     { "data": "name"} 
    ], 

    "processing": true, 
    "serverSide": true, 
    "searching": true, 
    "paging": true, 

    "ajax": { 
     url: "get_info.php", 
     type: 'POST' 

     }, 
    "order": [[ 2, 'asc' ]], 
    "lengthMenu": [ 
     [25, 50, 100], 
     [25, 50, 100] 
     ], 
    "iDisplayLength": 20, 

    "drawCallback": function (settings) { 
     var api = this.api(); 
     var rows = api.rows({page:'current'}).nodes(); 
     var last=null; 

     api.column(1, {page:'current'}).data().each(function (group, i) { 
      if (last !== group) { 
       $(rows).eq(i).before(
        '<tr class="group"><td colspan="8">'+group+'</td></tr>' 
       ); 

       last = group; 
      } 
     }); 
    } 
}); 

// Order by the grouping 
$('#devices tbody').on('click', 'tr.group', function() { 
    var currentOrder = table.order()[0]; 
    if (currentOrder[0] === 2 && currentOrder[1] === 'asc') { 
     table.order([ 2, 'desc' ]).draw(); 
    } 
    else { 
     table.order([ 2, 'asc' ]).draw(); 
    } 
    }); 
}); 

</script> 

   <tr> 
        <th>user</th> 

        <th>name</th> 

       </tr> 
       </thead> 
       <tfoot> 
       <tr> 
        <th>user</th> 

        <th>name</th> 

       </tr> 
       </tfoot> 
      </table> 

感謝任何幫助，

Answer 1

你需要的風格爲PAGINATE鏈接按鈕的類：

• 「paginate_button」 - 所有分頁按鈕都有這個類
• 「當前」 - 除了上面的類以外，它標記了當前頁面的按鈕。

所以，你可以包括與以下重寫的數據表CSS文件後CSS文件：

a.paginate_button { 
    // override font-color here. 
} 
a.paginate_button:hover { 
    // override hover font-color here. 
} 
a.paginate_button.current { 
    // override current page button styling here. 
}