| <!DOCTYPE HTML> |
| <style type="text/css"> |
| :nth-child(2){color:red;} |
| :nth-of-type(2){color:green;} |
| p:nth-child(2n){color:blue;} |
| div:nth-of-type(2n+1){color:yellow;} |
| </style> |
| <div> |
| <p> |
| This should be yellow, as this will inherit property of div. |
| </p> |
| <p> |
| This should be blue, as this is even child of type p. |
| </p> |
| <p> |
| This should be yellow, as this will inherit property of div. |
| </p> |
| <div> |
| This should be yellow, as it odd child of its own type. |
| </div> |
| </div> |
| <div> |
| This should be green, as this is 2nd child of its own type. |
| <p> |
| This should be green, as this will inherit property of div. |
| </p> |
| <p> |
| This should be blue, as this is the even child of div. |
| </p> |
| <p> |
| This should be green, as this is the odd child of its own type. |
| </p> |
| <p> |
| This should be blue, as this is the even child of paragraph. |
| </p> |
| </div> |
| <div> |
| This should be yellow, as this odd child of its own type. |
| <p> |
| This should be yellow,as this inherit property of div. |
| </p> |
| <span>This should be red,as this is the second child of div </span> |
| <span>This should be green, as this is the second child of its own type </span> |
| <div> |
| <span>This should be yellow,as this will inherit property of div i.e yellow as odd of its own type <i>and </i> <i>this should be green and italic </i></span> |
| </div> |
| </div> |
