DataTables分页按钮出现在第2页，但不在第1页

Question

我正在使用带有自定义分页按钮的DataTables。我使用CSS将分页按钮设置为背景属性。按钮正确地显示在第二页上，但是在第一页上，第一个和上一个按钮消失了，但是当我点击下一个按钮时，第一个和上一个按钮出现了。

第一页(加载页面时)

​

​

第二页(出现所有按钮)

​

​

第三页(按钮再次消失)

​

​

我想让他们一直在那里。我如何才能做到这一点。

JQuery

var table = $('#esignTable').DataTable({"sDom": '<"top"flp>rt<"bottom"i><"clear">',
      pagingType: 'input',
      pageLength: 10,
      language: {
        "sEmptyTable": " ",
        oPaginate: {
            "sNext": ' ',
            "sPrevious": ' ',
            "sFirst": ' ',
            "sLast": ' ',
        }
      }   
    });

CSS

.next {
   background: url(../images/integration/SlowRight.jpg);
}

.previous { 
   background: url(../images/integration/SlowLeft.jpg);
}

.first { 
   background: url(../images/integration/FastLeft.jpg);
}

.last {
   background: url(../images/integration/FastRight.jpg);
} 

如果我在CSS中做错了什么，请让我知道

谢谢

Answer 1

将!important添加到您的规则中或使用更具体的CSS规则。

例如：

.next {
   background: url(../images/integration/SlowRight.jpg) !important;
}

.previous { 
   background: url(../images/integration/SlowLeft.jpg) !important;
}

.first { 
   background: url(../images/integration/FastLeft.jpg) !important;
}

.last {
   background: url(../images/integration/FastRight.jpg) !important;
} 

代码和演示请参见this example。