Question

我在以下代码中有关于nth-child（2）的实现的问题。该代码在Chrome / Firefox中运行良好，并且第一个子矩阵转换在IE中表现良好。但是，我遇到了第二个子选择器的问题。虽然我知道IE8及以下版本不支持第n个孩子，但我试图利用selectizr和jQuery来启用，但我相信它可能在我的情况下不起作用（因为这些是服务器端jsp文件并且目标div被计算动态通过Javascript）。

我正在为此寻找解决方法......我只需要针对的第二个孩子。

我进行了搜索并发现了这篇文章：IE8 :nth-child and :before

有没有办法在我的情况下应用这个第一个孩子+ li a的方法？

如果没有，是否有任何人建议以此方法为目标？如果有帮助，这将用于定位从InfoVis工具包修改的StackedArea图表上方的浮动聚合。

感谢

.fte-chart-container .node > div > :first-child {
font-family: Arial;
color: black;
font-size: 11px;
width: 35px !important;
transform:rotate(-80deg);
-ms-transform:rotate(-80deg); /* IE 9 */
-moz-transform:rotate(-80deg); /* Firefox */
-webkit-transform:rotate(-80deg); /* Safari and Chrome */
-o-transform:rotate(-80deg); /* Opera */
-ms-filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.17364817766693044,
    M12=0.984807753012208, M21=-0.984807753012208, M22=0.17364817766693044, 
    SizingMethod='auto expand'); /* For IE8 */
filter: progid:DXImageTransform.Microsoft.Matrix(
        M11=0.17364817766693044,
        M12=0.984807753012208,
        M21=-0.984807753012208,
        M22=0.17364817766693044,
        SizingMethod='auto expand'); /* IE 6 and 7 */

}

.fte-chart-container .node > div > :nth-child(2) {
font-family: Arial;
color: black;
font-size: 10px;
transform:rotate(-60deg);
-ms-transform:rotate(-60deg); /* IE 9 */
-moz-transform:rotate(-60deg); /* Firefox */
-webkit-transform:rotate(-60deg); /* Safari and Chrome */
-o-transform:rotate(-60deg); /* Opera */
-ms-filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.4999999999999997, 
M12=0.8660254037844388, M21=-0.8660254037844388, M22=0.4999999999999997,   
SizingMethod='auto expand'); /* For IE8 */
filter: progid:DXImageTransform.Microsoft.Matrix(
        M11=0.4999999999999997,
        M12=0.8660254037844388,
        M21=-0.8660254037844388,
        M22=0.4999999999999997,
        SizingMethod='auto expand'); /* IE 6 and 7 */

}

Answer 1

如果你不知道第二个孩子究竟是什么，你可以用CSS中的:nth-child(2)替换:first-child + *：

.fte-chart-container .node > div > :first-child + *

但是在复杂选择器的末尾使用*可能在旧版浏览器中性能较差，因此您应该尝试识别要选择的元素，并将*替换为任何类型/类/等元素是。

定位：IE7 / IE8中的nth-child（2）

1 个答案: