当前位置：首页 → 问答吧 → ie6 不支持两个连续class，怎么解决？

ie6 不支持两个连续class，怎么解决？

时间：2011-12-28

来源：互联网

HTML code


<!doctype html>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
        <style>
            .i1 { font-size:21px; }
            .i2 { font-size:121px; }
            .i1.on { color:red; }
            .i2.on { color:blue; }
        </style>
    </head>
    <body>
        <span class="i1 on">我的颜色 有问题？</span>
        <span class="i2">我是垫背的</span>
    </body>
</html>

在ff中是红色，没问题，这就是向要的效果，
但是在ie6中却是蓝色，求解，不改变结构，有办法解决吗？

作者: ootwo 发布时间: 2011-12-28

.i2.on { color:blue; }
都没有这个class名啊

作者: zsx841021 发布时间: 2011-12-28

直接.i2就行了啊

作者: zsx841021 发布时间: 2011-12-28

HTML code


<!doctype html>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
        <style>
            .i1 { font-size:21px; }
            .i2 { font-size:121px; }
            .i1.on { color:red; }
            .i2.on { color:blue; }
        </style>
    </head>
    <body>
        <span class="i1 on">我的颜色 有问题？</span>
        <span class="i2 on">我是垫背的</span>
    </body>
</html>

这样 意思 清楚点。。

ff下 是对的 一个红 一个蓝

可是 ie6下两个都是蓝。。

高手支招，不改变结构，，怎么解决，，，


ie6不支持 .i1.on { color:red; } 这样的写法？

作者: ootwo 发布时间: 2011-12-28

刚试了下，ie7、8 都和 ff 一样

唯独 ie6 不认识 .i1.on { 这样连续写的类选择 }

作者: ootwo 发布时间: 2011-12-28

HTML code


<!doctype html>
<html>
    <head>
        <meta charset="gb2312" />
        <title></title>
        <style>
            .i1 { font-size:21px; }
            .i2 { font-size:121px; }
            .i1 .on { color:red; }
            .i2 .on { color:blue; }
        </style>
    </head>
    <body>
        <span class="i1"><span class="on">我的颜色 有问题？</span></span>
        <span class="i2"><span class="on">我是垫背的</span></span>
    </body>
</html>