jQuery / DataTables:如何改变分页颜色

问题描述 投票:4回答:3

我正在使用jQuery DataTables插件(版本1.9.4),并希望更改分页的颜色。

使用CSS我可以改变他们的背景颜色,但我找不到改变锚标签的字体颜色和字体悬停颜色的方法。我想将以下所有锚标签的字体颜色和悬停字体颜色都更改为白色(#FFFFFF)。

分页代码如下所示:

<div id="myTable_paginate" class="dataTables_paginate paging_full_numbers">
    <a id="myTable_first" class="first paginate_button paginate_button_disabled" tabindex="0">First</a>
    <a id="myTable_previous" class="previous paginate_button paginate_button_disabled" tabindex="0">Previous</a>
    <span>
        <a class="paginate_active" tabindex="0">1</a>
        <a class="paginate_button" tabindex="0">2</a>
    </span>
    <a id="myTable_next" class="next paginate_button" tabindex="0">Next</a>
    <a id="myTable_last" class="last paginate_button" tabindex="0">Last</a>
</div>

蒂姆,谢谢你的帮助。

jquery css pagination datatables jquery-datatables
3个回答
5
投票

也许你错过了!important宣言?在这种情况下,它确实很重要。

.paging_full_numbers a.paginate_button {
    color: #fff !important;
}
.paging_full_numbers a.paginate_active {
    color: #fff !important;
}

的jsfiddle - > http://jsfiddle.net/CrBkT/


0
投票

另一个答案是here

$.fn.dataTable.ext.classes.sPageButton = 'your class';

0
投票

经过一番搞砸之后,这就是我的工作;

    .page-item.active .page-link {
        color: #fff !important;
        background-color: #000 !important;
        border-color: #000 !important; 
    }

    .page-link {
        color: #000 !important;
        background-color: #fff !important;
        border: 1px solid #dee2e6 !important; 
    }

    .page-link:hover {
        color: #fff !important;
        background-color: #000 !important;
        border-color: #000 !important; 
    }
© www.soinside.com 2019 - 2024. All rights reserved.