CSS descendant selectors are very useful and make our work more convenient. But there's a problem, IE8 and IE8. The following are not compatible with many descendant selectors.
These six descendant selectors are relatively long-used:
You will find that IE9 is compatible with these descendant selectors. IE8, IE7 except for: First-child is compatible, the other five are incompatible.
Compatible:
<body> <div> <p>aaaa</p> <p>aaaa</p> <p>aaaa</p > <p>aaaa</p> </div> </body>
First, let the 2nd P element become a "blue" font.
This is generally the case with Div p:nth-child (2) {color:blue;}
or div p:nth-of-type (2) {color:blue;}
Or just add class to the 2nd P element.
To be compatible on IE7,IE8:
The first method: Div>p:first-child+p {color:blue;}
The second approach is to use jquery:
if (navigator.appname = = = ' Microsoft Internet Explorer ') {//Determine if it is IE browser if (Navigator.userAgent.match (/trident/i) & amp;& Navigator.userAgent.match (/msie 8.0/i)) { $ (' P:nth-child (2) '). CSS (' Color ', ' blue ');
$ (' P:nth-of-type (2) '). CSS (' Color ', ' Blue ');} }
First, let the 2nd, 4th p elements into a "blue" font.
This is generally the case with Div p:nth-child (2n) {color:blue;}
or div p:nth-of-type (2n) {color:blue;}
To be compatible on IE7,IE8: DF SASDA
if (navigator.appname = = = ' Microsoft Internet Explorer ') {//Determine if it is IE browser if (Navigator.userAgent.match (/trident/i) & amp;& Navigator.userAgent.match (/msie 8.0/i)) { $ (' P:nth-child (2n) '). CSS (' Color ', ' blue '); $ (' P:nth-of-type (2n) '). CSS (' Color ', ' Blue ');} }
: Nth-child (Odd),: Nth-child (odd) odd even number, can also be handled this way.
The CSS descendant selector is compatible with IE8 and IE8