覆蓋datatables css

Question

我使用datatables與他們的本地css可以節省大量的時間。我想要做的是用我自己的css覆蓋某些元素，但保留所有數據表提供的內容。

這是我嘗試過但沒有工作，我敢肯定，有一些基本的東西我在這裏失蹤，所以隨時指向我一個turorial或東西，但我搜索了數據表論壇和谷歌的小時沒有成功。

//Links to DataTables css and js 
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/ju-1.11.4/jqc-1.12.4/dt-1.10.13/fh-3.1.2/datatables.min.css"/> 
<script type="text/javascript" src="https://cdn.datatables.net/v/ju-1.11.4/jqc-1.12.4/dt-1.10.13/fh-3.1.2/datatables.min.js"></script> 

//This is my own css class 
table.mycss tr.odd { background-color: red; } 
table.mycss tr.even { background-color: green; } 

//This is how the styles are applied to the table 
echo "<table id='hof-table' class='dataTable display cell-border mycss' cellspacing='0' width='100%'>"; 

Answer 1

問題很可能是由規則聲明的詳細程度不同造成的。

你定義table.mycss tr.odd，但如果你在遠程數據表的樣式表搜索，你可以看到，tr.odd第一次出現將出現在更detaild規則（類似於​​），因此更高的優先級分配給該規則。

嘗試使您的規則更具體，或者如果太難了，請將!important子句添加到您的規則中。這不是一個推薦的做法，因爲使未來的編輯更加複雜，特別是如果由其他人完成。

你可以看一下here，它描述了一個計算css規則特殊性的非常簡單的方法。