Como tornar o Internet Explorer 8 para suportar o elemento CSS nth child ()?

Eu quero dar um efeito de faixa de zebra para minhas linhas de tabela. Em todos os outros navegadores, isso pode ser feito usando o elemento filho CSS nth. Mas eu quero fazer isso IE 8 também. Então, como posso fazer isso?

Você pode usar o http://selectivizr.com/ JS que suporta o seletor css3 para o IE.

Com polyfill: Selectivizr é bom o suficiente.

Sem polyfill: Como o IE8 suporta first-child, você pode enganar isso para suportar nth-child no iE8 ie

 /*li:nth-child(2)*/ li:first-child + li {}/*Works for IE8*/ 

Embora não possamos emular seletores complexos, ou seja, n-filho (2n + 1) ou n-filho (ímpar) para o IE8.

Como alternativa ao Selectivizr, você pode usar um pouco de jQuery:

 $('.your-list li:nth-child(3n+1)').addClass('nth-child-3np1'); 

Em seguida, basta adicionar um segundo seletor no seu CSS:

 :nth-child(3n+1) { clear: both; } .nth-child-3np1 { clear: both; } 

Os seletores ‘first-child’ e ‘+’ estão ambos disponíveis no IE7, e o ‘+’ é aditivo.

Portanto, ‘n-filho’ pode ser simulado adicionando sucessivamente seletores ‘+’, então:

 tr:nth-child(4) 

torna-se:

 tr:first-child + tr + tr + tr 

Se todos os elementos irmãos forem iguais, o caractere curinga ‘*’ será suficiente, como em:

 tr:first-child + * + * + * 

o que reduzirá o tamanho do arquivo css se especificar várias linhas.

Observe que os espaços entre os seletores não são necessários, portanto, o tamanho do arquivo pode ser reduzido ainda mais, deixando-os fora, para selecionar a 1ª, 3ª e 5ª linhas:

 tr:first-child,tr:first-child+*+*,tr:first-child+*+*+*+* 

Claro que um não gostaria de atender a tabelas muito grandes!

Se estiver usando o * como um preenchimento, certifique-se de que o elemento :first-child e o último elemento recebam o tagname explícito, pois a regra será testada em todos os elementos do DOM e a especificação de ambos os elementos forçará explicitamente a falha No final, um determinado navegador aplica suas regras primeiro, em vez de falhar depois de ter passado por vários elementos em cada sequência para, eventualmente, falhar na regra para cada um deles. Não faça seu navegador funcionar sem um bom motivo!