使用CSS的交替行顏色在另一個內不起作用

這是爲什麼？兩個blockquotes都是藍色的。 TR的顏色是交替的，但是塊狀的不會。怎麼來的？使用CSS的交替行顏色在另一個內不起作用

<tr> 
    <blockquote>Hello</blockquote> 
</tr> 

<tr> 
    <blockquote>Hello</blockquote> 
</tr> 



tr:nth-child(even){ background-color: #272727; } 
tr:nth-child(odd) { background-color: #222222; } 

blockquote:nth-child(even){ background-color: red; } 
blockquote:nth-child(odd) { background-color: blue; }

來源

2013-11-25 peckinpah

對於初學者來說是HTML是無效的。 – j08691

將'blockquote'標籤放在'td'標籤中。其次，blockquotes不是在同一個標籤中的兒童（但是在一個td中有兩個blockquotes，看看它是否有效）。 –

使用nth-of-type代替：

tr:nth-of-type(even) { 
    background-color: #272727; 
} 
tr:nth-of-type(odd) { 
    background-color: #222222; 
} 
tr:nth-of-type(even) blockquote { 
    background-color: red; 
} 
tr:nth-of-type(odd) blockquote { 
    background-color: blue; 
}

jsFiddle example（顏色改變的可視性）

來源

2013-11-25 19:59:17 j08691

完成了！謝謝！ – peckinpah

是的，你也可以按照你在這裏的方式去做，只需要有一個主要的父母：http://jsfiddle.net/Riskbreaker/387RZ/1/ – Riskbreaker

兩個區塊報價均爲其各自父母的第1個要素，這是奇怪的。所以：塊引用：第n個孩子（奇數）是真實的。

來源

2013-11-25 19:59:11 Fallenreaper

使用CSS的交替行顏色在另一個內不起作用

回答

相關問題