css3 - CSS: Select every 2nd child but not every 4th -
I have to select every 2 children of an element, but if it is 4 (4, 8, 12 ..) its Should not be selected. So what I want [2, 6, 10, 14] "respectively"
My current solution is:
p: nth-child (2n) {background: purple; } P: nth-child (4n) {background: white; }
Now the color of the purple background is in 2, 6, 10th and 14th elements. But this is not a great way to solve the problem.
Can I add these two selectors in some way?
p: nth-child (2n \ 4n) {// just an idea that this selector How the background can work: purple; }
This should work for your sequence ([2, 6, 10, 14].):
p: nth-child (4n-2) {background: purple; } p: nth-child (4n-2) {background: purple; Color: #fff; }
& lt; P & gt; Homepage 1 and & lt; / P & gt; & Lt; P & gt; Ad 2 & lt; / P & gt; & Lt; P & gt; Homepage 3 & lt; / P & gt; & Lt; P & gt; Website 4 & lt; / P & gt; & Lt; P & gt; Ad 5 & lt; / P & gt; & Lt; P & gt; Advertising 6 & lt; / P & gt; & Lt; P & gt; Advertising 7 & lt; / P & gt; & Lt; P & gt; Ads 8 & lt; / P & gt; & Lt; P & gt; Job 9 & lt; / P & gt; & Lt; P & gt; Advertising 10 & lt; / P & gt; & Lt; P & gt; Homepage 11 & lt; / P & gt; & Lt; P & gt; Advertising 12 & lt; / P & gt; & Lt; P & gt; Advertising 13 & lt; / P & gt; & Lt; P & gt; Website 14 & lt; / P & gt; & Lt; P & gt; Advertising 15 & lt; / P & gt; & Lt; P & gt; Advertising 16 & lt; / P & gt;
Comments
Post a Comment