數據表隱藏/顯示隱藏的列按鈕CSS樣式

我使用數據表隱藏/顯示隱藏的列按鈕CSS樣式

<th class="none"></th>

隱藏在數據表表最後一欄。 Datatable在第一列中創建一個按鈕，以在子行中顯示/隱藏此列。該按鈕的顏色在responsive.bootstrap.min.css設置：

table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before{ background-color:#5d9cec }

我添加了一個自定義類的第一列作爲取決於行數據禁用按鈕：

.not-active { pointer-events: none; cursor: default; }

我根據某些行的內容通過C＃設置類。

<tr><td class='<%# DisableLink(Eval("InvoiceDate").ToString()) %>'><%# Eval("InvoiceNumber")%></td>

所有這些按預期工作。

我想現在做的是設置當TD的類設置爲.NOT活性，在寫作背景色按鈕的背景顏色爲灰色。

我已經試過

.not-active > table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child:before{ background-color:#5d9cec }

和幾十種不同的組合，但似乎無法得到正確的格式。

有什麼建議嗎？謝謝！

添加FSFiddle的要求：https://jsfiddle.net/yk06fbxa/3/

來源

2016-12-28 Diomedes

你可以發佈小提琴鏈接嗎？ –

@PriyaPayyavula https://jsfiddle.net/yk06fbxa/3/謝謝！ – Diomedes

我假設你正在尋找類似於下面的解決方案。 http://stackoverflow.com/questions/14307163/changing-background-color-of-all-elements-with-the-same-class –

，設置背景色的CSS規則是

table.dataTable.dtr-inline.collapsed tbody td:first-child:before, 
table.dataTable.dtr-inline.collapsed tbody th:first-child:before { 
    ... 
    background-color: #31b131; 
}

要覆蓋此當<td>有類not-active，你可以修改它像：

table.dataTable.dtr-inline.collapsed tbody td.not-active:first-child:before, 
table.dataTable.dtr-inline.collapsed tbody th.not-active:first-child:before 
{ 
    background-color:#dddddd; 
}

查看演示here。我已將第一行的td設置爲不具有not-active類，以確保它僅適用於.not-active類。

來源

2016-12-28 19:14:18

完美，謝謝！ – Diomedes

數據表隱藏/顯示隱藏的列按鈕CSS樣式

回答

相關問題