重置CSS元素的懸停屬性

我正在Wordpress網站上工作，併爲特定頁面添加一些自定義JavaScript和CSS。我是CSS新手，在閱讀了很多不同的條目後，仍然無法找出答案。重置CSS元素的懸停屬性

我正在使用的主題設置了某些表格元素的懸停屬性，現在我需要未設置這些因爲它會干擾我創建的頁面。如果我刪除主題CSS規則，那麼一切都很好，但網站的其他部分無法正常工作，另外我不想更改父主題。我無法弄清楚如何刪除已經定義的懸停屬性。看起來我應該能夠制定一個更具體的規則來做我想做的事情，但我似乎也無法做到這一點。我認爲這可能是一個簡單的問題，但我似乎無法找到答案。

我想覆蓋影響表格懸停特性的所有規則。

/* from the theme */ 
table { 
    width: 100%; 
    margin: 1.62em 0 0; 
    border-radius: 4px; 
} 

td, 
th { 
    padding: .5em 1em 
} 

/* this is my problem rule */ 
tbody tr:hover td, 
tbody tr:hover th { 
    background-color: rgba(0, 0, 0, .05) 
}

DEMO：https://jsfiddle.net/4ty7h8oy/4/

來源

2016-03-26 dirkt

不是一個很好的解決方案，但我認爲[this]（https://jsfiddle.net/4ty7h8oy/7/）是CSS的最佳選擇。 – Harry

這是一種蠻力的方式（這是我期望我必須做的一種）。你的例子顯示了它是如何完成的，這對我來說是一個很大的幫助。謝謝@哈里。 – dirkt

請試試這個：

您可以添加自定義類的TR或TD這樣，定義的CSS屬性，這一點，也不會影響其他TR要TD：

<table border="1" cellspacing="0" cellpadding="0"> 
    <tbody> 
    <tr class="myclass"> 
     <td class="lastMonth">1</td> 
     <td class="thisMonth">A</td> 
    </tr> 
    <tr> 
     <td class="today">2</td> 
     <td class="nextMonth">B</td> 
    </tr> 
    <tr class="myclass"> 
     <td>3</td> 
     <td>C</td> 
    </tr> 
    </tbody> 
</table>

CSS：

tbody tr.myclass:hover td, 
    tbody tr.myclass:hover th { 
    background-color: rgba(56, 25, 44, .05) 
    }

來源

2016-03-26 11:06:02 satya

重置CSS元素的懸停屬性

回答

相關問題