如何替換DIV行上的背景顏色？（jquery和/或CSS）

我正在爲現有的HTML輸出定製CSS。所以我不能改變輸出，我只能添加腳本（Jquery/Javascript）和自定義CSS。如何替換DIV行上的背景顏色？（jquery和/或CSS）

輸出的各行，形成的物品的列表。這是CSS標識符的結構：

<div> 
    <div class="D F"> 
     <div id=":b" class="G"> 
     <div id=":c" class="G"> 
     <div id=":d" class="G"> 
     <div id=":e" class="G"> 
     <div id=":f" class="G"> 
     <div id=":g" class="G"> 
     <div id=":h" class="G"> 
    </div> 
</div>

的div的ID可以變化。在某些情況下，它在我的例子所示，在其他情況下，它具有:1，:2，:3，等等。或者其他一些數字/字母組合。所以這不是我可以依賴的CSS聲明。

我曾嘗試使用下面的腳本試過了，沒有效果（發現，並修改爲從here）：

$('.D>div:odd').css("background-color", "#ff0000"); 
$('.D>div:even').css("background-color", "#00ff00");

我也嘗試下面的CSS（發現和here修改）：

div.G div:nth-child(even) {background: #CCC;} 
div.G div:nth-child(odd) { background: #FFF;}`

但是這使得每個div行灰色。他們沒有交替。

我創建了一個小提琴這裏：http://jsfiddle.net/inspirednz/qgb9s8cq/4/

那一個包含嵌套我指定的div內的其他各種申報單。因爲某種原因（我不清楚），我宣佈的替代顏色實際上會影響div行之一（div.V），所以我將它們留在小提琴中。但不是其他人。

這裏是另一個小提琴，所有的嵌套的div取出。在這種情況下，相同的CSS根本沒有任何作用。

http://jsfiddle.net/inspirednz/qgb9s8cq/3/

來源

2016-07-25 inspirednz

你想隨機顏色還是什麼？ –

如果我理解正確的，你想要什麼，然後你想定位div的不div的裏面他們：

div.G:nth-child(even) {background: #CCC;} 
div.G:nth-child(odd) { background: #FFF;}

它總是最好使用CSS在JS，因爲它的硬件accelarated。

小提琴http://jsfiddle.net/qgb9s8cq/5/

來源

2016-07-25 23:32:28

輝煌。謝謝。很高興看到我幾乎*在那裏。所以，我使用的CSS是針對嵌入式div。我想知道爲什麼那個額外的「div」在那裏，但從來沒有想過把它拿出來！很高興有這個工作，並且很高興這一切都用CSS完成。感謝Marko。 – inspirednz

不用擔心:) :) –

這是你在找什麼？我對CSS3並不十分熟悉，但我給了它一個鏡頭。

http://jsfiddle.net/qgb9s8cq/6/

div.G:nth-child(even) { 
    background: #CCC; 
} 

div.G:nth-child(odd) { 
    background: #FFF; 
}

想我應該在發佈前已經刷新...

來源

2016-07-25 23:36:56 Almond

謝謝杏仁。非常感激。是的，似乎Marko也打賭你。我已經標記了你的答案並且有用，而且他是正確的（自他第一次起）。 :-) – inspirednz

如何替換DIV行上的背景顏色？ （jquery和/或CSS）

回答

相關問題

如何替換DIV行上的背景顏色？（jquery和/或CSS）